前端html+css
关注
分享
扫一扫
文章平均质量分 88
01star️
永远没有正确的选择，而是让选择变正确
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
flex布局
数值越小，排列越靠前，默认为0。原创 2025-09-21 10:18:43 · 149 阅读 · 0 评论 -
浏览器私有前缀、CSS3：2D转换、动画、3D转换
注：倒数第三行是scale。原创 2025-09-20 15:24:02 · 958 阅读 · 0 评论 -
HTML5和CSS3新增的一些属性
如果盒子模型改为box-sizing：border-box;nth-of-type则是把指定的孩子排列序号，执行时先看标签，然后再回去看nth-of-type是第几个孩子，下面这样就可以选出来。nth-child会把所有的孩子排序号，执行时先看nth-child（1）然后再往前看找标签，下面这种情况就是选不出来的。n也可以是公式，同时，n从0开始计算，注意nth-child(0)这里面必须是n，不能是其他的字母。原则：谁动给谁加，也就是谁要过渡，就把transition放在谁里面。原创 2025-09-14 21:19:24 · 1137 阅读 · 0 评论 -
CSS高级技巧---精灵图、字体图标、布局技巧
由此，我们发现第四个盒子的右边框被压到了，此时只需要当前的盒子添加position: relative;多行文本溢出显示省略号，有较大兼容性问题， 适合于webKit浏览器或移动端（移动端大部分是webkit内 核）。核心原理：将网页中的一些小背景图像整合到一张大图中，这样服务器只需要一次请求就可以了。精灵技术的目的：为了有效减少服务器接收和发送请求的次数，提高页面的加载速度。字体图标展示的是图标，但是本质上是字体，具有字体的属性。6.使用精灵图的时候需要精确测量，每个小背景图片的大小和位置。原创 2025-09-13 21:37:11 · 1189 阅读 · 0 评论 -
CSS基础（四）---定位、叠放次序、元素的显示与隐藏
在使用定位布局时，可能会出现盒子重叠的情况，此时，可以使用z-index来控制盒子的前后次序（z轴）。语法：选择器{ z-index: 1;1.数值可以是正整数、负整数或0，默认是auto，数值越大，越靠上（数值大的盒子会压住数值小的盒子）。2.如果属性相同，则按书写顺序，后来者居上。3.数字后面不能加单位。4.只有定位的盒子才有z-index属性。1）标准流：可以让盒子上下排列或者左右排列，垂直的块级只显示就用标准流布局。2）浮动：可以让多个块级元素一行显示或者左右对齐盒子，原创 2025-09-12 20:14:27 · 985 阅读 · 0 评论 -
CSS基础（三）---盒子模型、盒子阴影、圆角边框、浮动、清除浮动
2、一个元素浮动了，理论上其余的兄弟元素也要浮动：一个盒子里面有多个子盒子，如果其中一个盒子浮动了，那么其他兄弟也应该浮动，以防止引起问题。浮动的盒子只会影响浮动盒子后面的标准流，不会影响前面的标准流。如果不给父盒子高度，由于子盒子浮动不占位置，最后父盒子高度会变成0，会影响后面的标准流的盒子。左盒子加了浮动，此时左盒子不再保留原先的位置，蓝色盒子迎面扑来，粉色盒子就在蓝色盒子下面，如上图的效果。浮动的元素是互相贴靠在一起的（不会有缝隙），如果父级宽度装不下这些浮动的盒子，多出的盒子会另起一行对齐。原创 2025-09-09 20:55:29 · 907 阅读 · 0 评论 -
CSS基础（二）---复合选择器、元素显示模式、背景、特性
a {;</style><body></body>转换为行内元素：display:inline;<style>div {</style><body></body>行内元素转换为行内块元素：display:inline-block;<style>span {原创 2025-08-30 16:16:17 · 922 阅读 · 0 评论 -
CSS基础（一）---CSS选择器、字体属性、文本属性、引入方式
h2 { font-family: '微软雅黑';各种字体之间用英文逗号隔开，如果有空格隔开的多个单词组成的字体加引号。尽量使用系统默认自带字体。最常见的几个字体：'Microsoft YaHei' 、tahoma'、arial 、'Hiragino Sans GB'---定义文本的外观，如文本颜色、对齐文本、装饰文本、文本缩进、行间距等。行内样式表：<标签 style="属性:属性值;"></标签>内部样式表：选择器{属性:属性值;属性:属性值;原创 2025-08-25 14:45:19 · 768 阅读 · 0 评论 -
前端HTML学习笔记
Shift + Alt + 上箭头 / 下箭头 ：快速复制一行ctrl + d：选中多个相同单词ctrl + Alt + 上箭头 / 下箭头：添加多个光标ctrl + h：全局替换ctrl + g：快速定位到某一行shift + alt然后拖动鼠标：选择某个区块ctrl + +/-：放大 / 缩小编辑区ctrl + /：单行注释shift + alt + a：多行注释alt + z：自动换行。原创 2025-06-19 21:28:44 · 798 阅读 · 0 评论