- 2024-08-13只用一个 HTML 元素可以写出多少形状？——多边形篇
上一篇章的末尾，我们只用一个 div 元素写了一个鸡蛋，在欧几里得平面几何中，鸡蛋的形状已经不能算是标准形状了。对于非标准的形状，没有比较直观的几何规律，命名方面也更加困难，俗称不规则图形，在欧几里得平面几何中，将其统称为多边形。在平行四边形篇中，我们首先使用常规的盒模型写出
- 2024-08-12前端必知必会-CSS边距Margin
文章目录CSS边距Margin边距-各个侧面边距-简写属性CSS边距折叠总结CSS边距Margin边距Margin用于在元素周围、任何定义的边框之外创建空间。有一些属性可用于设置元素每侧的边距（顶部、右侧、底部和左侧）。边距-各个侧面CSS具有用于指定元素每侧边距的属
- 2024-06-04JavaScript省市区县选择三级联动实现
<!DOCTYPEhtml><htmllang="en"><head> <metacharset="UTF-8"> <style> .select-container{ margin:20pxauto; width:610px; } select{ width:200px; height:25px;
- 2024-05-29css16 CSS Padding
https://www.w3schools.com/css/css_padding.aspPaddingisusedtocreatespacearoundanelement'scontent,insideofanydefinedborders. <!DOCTYPEhtml><html><head><style>div{padding:70px;border:1pxsolid#4C
- 2024-05-25[前端]盒子模型
margin:外边距padding:内边距border:边框盒子的计算方式:这个元素到底又多大margin+border+padding+内容宽度外边距可能的值值说明auto设置浏览器边距。这样做的结果会依赖于浏览器length定义一个固定的margin（使用像素，pt，em等）%定义一个使用百分比
- 2024-04-30给弹框添加关闭按钮
效果如下：代码:父组件<template><el-containerclass="container"><h1>这是父组件</h1><HelloWorldv-if="detailVisible"msg="WelcometoYourVue.jsApp"@detailClose="detailClose"/><
- 2024-01-21玛珍，玛珍，margin！
最近在整理巩固面试相关的资料，又看到了熟悉的老朋友：margin，当时觉得其读起来很亲切，现在又发现很多遗忘的知识点。了解marginmargin，译为“外边缘”，在CSS作为属性定义元素周围的空间，从以下盒模型中能更好的理解margin。属性描述margin简写属性。在一个声明中设置所有外
- 2023-12-22CSS设置一个梯形
1、图形2、代码<!DOCTYPEhtml><html><head><metacharset="utf-8"><title></title><style> .d{ width:0px; height:100px; border-left:25pxsolid; border-top:25pxsolidtransparent; border-bottom:2
- 2023-09-14html css dotted border 边框虚线太密
三角形/**正三角*/.triangle{width:0;height:0;border-style:solid;border-width:025px40px25px;border-color:transparenttransparentrgb(245,129,127)transparent;}/**倒三角*/.triangle{width:0;height:0;border-style:solid;bor
- 2023-03-02元素的宽度和高度
元素的宽度和高度重要: 当您指定一个CSS元素的宽度和高度属性时，你只是设置内容区域的宽度和高度。要知道，完整大小的元素，你还必须添加内边距，边框和外边距。下面的例子
- 2023-01-29零基础学前端之CSS填充和宽高
这节课，我们学习CSS填充属性和CSS宽度与高度属性。还是看这个例子，每个区块除了设置外边距，还有内容周围的空间以及内容的宽高设置。CSS 填充属性用于在一个元素的内容周
- 2022-12-21[CSS3] 绘制六边形
#hexagon{width:100px;height:55px;background:red;position:relative;}#hexagon:before{content:"";position:absolute;
- 2022-12-14CSS-3D动画 webpack-logo
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content=