![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
从0开始的CSS之旅
文章平均质量分 57
扶摇|
这个作者很懒,什么都没留下…
展开
-
re:从0开始的CSS之旅 20. 渐变(暂完结撒花)
渐变:使背景颜色有逐渐变化的效果。原创 2024-02-17 09:47:42 · 664 阅读 · 0 评论 -
re:从0开始的CSS之旅 19. 背景
背景颜色 背景图片 背景平铺 背景图像滚动 背景图片位置;2. 若我们值规定了一个值,另外一个默认值为。背景图片会随着页面中其余部分滚动(默认值)当页面中其余部分滚动,背景图片位置不变。设置背景图像的滚动方式。无背景图片(默认值)原创 2024-02-17 09:44:27 · 702 阅读 · 0 评论 -
re:从0开始的CSS之旅 18. z-index
z-index 属性用于设置元素的叠放层次,属性值可以为一个整数,整数值越大越优先显示。原创 2024-02-16 23:39:30 · 595 阅读 · 0 评论 -
re:从0开始的CSS之旅 17. 定位
定位:将盒子指定到页面中的任意位置。position属性可以开启元素的定位static没有开启定位(默认值)relative开启元素相对定位absolute开启元素的绝对定位fixed开启元素的固定定位sticky开启元素的粘性定位开启定位后,通过四个属性设置元素的位置。原创 2024-02-16 09:42:48 · 880 阅读 · 0 评论 -
re:从0开始的CSS之旅 16. 高度塌陷问题
高度塌陷问题:在文档流中,父元素的高度默认是被子元素撑开的,子元素多高,父元素就多高。上述三种方式能解决高度塌陷的问题,但是宽度会丢失,因此不推荐使用。父元素在文档流中一旦发生高度塌陷的问题,将影响整个页面的布局。可以根据子元素的高度设置父元素的高度,使页面看起来不塌陷。1. 为需要解决高度塌陷问题的父元素再创建一个子元素。在W3C标准中,页面元素都有一个隐藏的属性,简称。2. 该子元素需要清除第一个元素浮动带来的影响。开启BFC的元素不会被浮动元素覆盖。开启BFC的元素可以包含浮动元素。原创 2024-02-14 23:35:16 · 1472 阅读 · 0 评论 -
re:从0开始的CSS之旅 15. 浮动
1. 浮动元素目的就是为了让盒子横向(水平)排列,完成水平方向的布局。浮动:使元素浮起来,脱离文档流,从而使盒子能够灵活的移动。2. 浮动元素不会盖住文字,文字会自动环绕在浮动元素的周围。元素不浮动,默认在文档流中排列(默认值)浮动的盒子会一行显示并且顶部对齐。浮动元素将具有行内块元素的特点。,不会影响前面文档流的盒子。浮动元素会脱离文档流。原创 2024-02-14 23:31:03 · 733 阅读 · 0 评论 -
re:从0开始的CSS之旅 14. 显示模式的切换
不显示元素,并且不占用元素的位置。属性可以用于转换元素的显示模式。隐藏元素,但是占用元素的位置。属性用于设置元素是否显示。原创 2024-02-13 21:58:24 · 1015 阅读 · 0 评论 -
re:从0开始的CSS之旅 13. 文档流
文档流(标准流、普通流 normal flow):HTML文档中一些皆为盒子,而盒子在HTML文档中默认的显示标准,称为文档流。- 块元素是容器,里面可以放块元素、行内元素、行内块元素。- 文字类的块元素不能自由嵌套(尽量不要放块元素)- 和相邻的行内元素(行内块元素)在一行显示。他们同时拥有块元素与行内元素的特点。链接中可以放块元素,但是最好将。- 默认宽度是父级宽度的100%- 宽度和高度等都可以设置。- 默认宽度是其内容的宽度。因此我们称为 行内块元素。- 宽度和高度设置无效。- 行内元素可以设置。原创 2024-02-13 21:54:43 · 1038 阅读 · 0 评论 -
re:从0开始的CSS学习之路 11. 盒子垂直布局
若两个盒子具有父子关系,则两个盒子的上外边距会发生重叠,若改变盒子的上外边距,父子盒子都会随之移动位置。若两个“相邻”垂直摆放的盒子,上面盒子的下外边距与下面盒子的上外边距会发生重叠,称为。2. 可以为父元素添加内边距。1. 可以为父元素添加边框。原创 2024-02-12 11:47:59 · 1412 阅读 · 0 评论 -
re:从0开始的CSS之旅 12. 轮廓、阴影、圆角
outline设置元素的轮廓使用方式与border一样。不同在于。原创 2024-02-12 11:50:32 · 940 阅读 · 0 评论 -
re:从0开始的CSS学习之路 10. 盒子模型的溢出
父子两个盒子,子盒子的宽度或高度,大于父盒子,则子盒子多余的部分会在父盒子之外进行显示。属性,可以设置父元素如何处理溢出的内容。多余的部分,称为“溢出的部分”不会处理溢出部分(默认值)会根据需要自动的添加滚动条。原创 2024-02-10 17:34:23 · 800 阅读 · 0 评论 -
re:从0开始的CSS学习之路 9. 盒子水平布局
过年也不能停止学习,一停下就难以为继,实属不应。原创 2024-02-10 17:31:33 · 893 阅读 · 0 评论 -
re:从0开始的CSS学习之路 8. 浏览器默认样式
在布局的时候通常不想要浏览器的默认样式,因此可以先清除一下浏览器提供的默认样式。浏览器会有一个默认样式,原创 2024-02-08 23:18:05 · 1258 阅读 · 0 评论 -
re:从0开始的CSS学习之路 7. 盒子模型
盒子模型(box model):可以把HTML中所有的元素都理解成盒子,用于装内容的容器目的就是为了将HTML文档中的内容进行归纳整理,方便管理,从而达到布局的效果内容区content边框border内边距padding外边距margin。原创 2024-02-08 23:12:14 · 1029 阅读 · 0 评论 -
re:从0开始的CSS学习之路 6. 字体相关属性
设置多个字体的目的是为了用户尽可能的支持字体。可以设置多个字体,每个字体之间以逗号隔开。若字体名称中包含空格,则必须使用双引号。100-900,值后没有单位。字体的系列(字体簇)属性设置所有的相关属性。原创 2024-02-07 11:40:03 · 758 阅读 · 0 评论 -
re:从0开始的CSS学习之路 5. 颜色单位
没想到在CSS里也要再次了解这些颜色单位,感觉回到了大二的数字图像处理,可惜现在已经大四了,感觉并没有学会什么AI的东西。原创 2024-02-07 11:35:57 · 801 阅读 · 0 评论 -
re:从0开始的CSS学习之路 4. 长度单位
一个像素就是屏幕中一个不可分割的点。我们应用的屏幕实际上是由一个个的像素点构成的。不同显示器的像素点大小也不同,在屏幕尺寸相同的情况下,像素越小,显示效果越清晰。优点:当父元素大小发生变化时,子元素的大小也会按比例进行调整。1em = 当前字体大小(1倍的font-size)百分比%:相对于父元素相同样式大小的百分比进行计算。优点:字体大小发生变化时,em也会随之发生变化。2em = 2倍font-size。:相对于当前元素字体大小进行计算。:相对于根元素字体大小进行计算。有些时候可能会有奇效。原创 2024-02-06 21:41:23 · 994 阅读 · 1 评论 -
re:从0开始的CSS学习之路 3. CSS三大特性
很多的学习其实并不知道在学什么,学一个新东西学着学着就变成了抄代码,背概念。把看视频学习变成了一个赶进度的任务,到头来只学到了一些皮毛。原创 2024-02-06 21:38:07 · 1349 阅读 · 1 评论 -
re:从0开始的CSS学习之路 2. 选择器超长大合集
虽然现在还是不到25的青年人,有时仍会感到恐慌,害怕不定的未来,后悔失去的时间,但细细想来,只有自己才知道,再来一次也不会有太多的改变。CSS的选择器五花八门,而且以后在JavaScript中也会用到,所以就把所有的选择器写到一篇文章里好了。:同时为了方便展示,全部使用的形式,实际的应用中还是推荐使用。原创 2024-02-05 21:24:56 · 1635 阅读 · 0 评论 -
re:从0开始的CSS学习之路 1. CSS语法规则
现在大模型卷的飞起,感觉做页面的活可能以后就不需要人来做了,不知道现在还有没有学前端的必要。。。原创 2024-02-05 20:32:17 · 756 阅读 · 0 评论