![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
文章平均质量分 92
Cherry_Zj
这个作者很懒,什么都没留下…
展开
-
CSS 进阶学习(二)
文章目录粘连布局粘连布局粘连布局(css sticky footer):我们有一块内容<main>。当<main>的高度足够长的时候,<footer>应该紧跟在<main>元素的后面。当<main>元素比较短的时候(比如:小于屏幕高度),我们期望这个<footer>元素能够“粘连”在屏幕的底部。示例:<!DOCTYPE html><html> <head> <meta cha原创 2021-07-03 16:10:08 · 108 阅读 · 0 评论 -
CSS-清除浮动
文章目录清除浮动清除浮动1、给父级加高度扩展性不好2、开启BFC① overflow:hidden;②定位③浮动④IE6和IE7不支持BFC3、<br />标签IE6不支持4、空标签违反了结构 行为 样式相分离的原则IE6下元素的最小高度为19px可以尝试给元素的font-size设为0---->2px5、伪元素+开启haslayoutIE6和IE7不支持伪元素,所以要额外的去开启haslayout...原创 2021-07-03 15:49:46 · 105 阅读 · 0 评论 -
CSS 进阶学习(一)
文章目录定位包含块默认值百分比浮动伪等高布局三列布局定位浮动圣杯布局圣杯布局(+伪等高布局)双飞翼布局(+伪等高布局)圣杯布局和双飞翼布局实现的对比滚动条禁止系统默认滚动条使用绝对定位来模拟固定定位定位定位参照于谁来定位?没有定位:包含块相对定位:元素本来的位置(该位置在文档流里面)绝对定位:包含块①如果最近的祖先元素中存在定位元素,则定位元素就是包含块;②如果没有,包含块为初始包含块固定定位:视口包含块“根元素”的包含块(也成为初始包含块)。在HTML中,根元素就是html元素,原创 2021-05-23 17:42:12 · 147 阅读 · 0 评论 -
HTML+CSS的项目练习
效果图:HTML代码:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>polo360练习</title> <!--引用reset.css用来清除浏览器的默认样式--> <link rel="stylesheet" type="text/css" href="css/reset.css"/> <!--引入p原创 2021-05-16 10:54:58 · 1386 阅读 · 0 评论 -
高度塌陷问题
高度塌陷问题在文档流中,父元素的高度默认是被子元素撑开的,也就是子元素多高,父元素就多高。但是,为子元素设置浮动以后,子元素会完全脱离文档流,此时会导致子元素无法撑起父元素的高度,导致父元素的高度塌陷。由于父元素的高度塌陷了,则父元素下的所有元素都会向上移动,这样将会导致页面布局混乱。所以在开发中一定要避免出现高度塌陷的问题。我们可以将父元素的高度写死,以避免出现高度塌陷问题,但是一旦高度写死,父元素的高度就不能自动适应子元素的高度,所以这种方案是不推荐使用的。示例:<!DOCTYPE原创 2021-05-02 19:14:34 · 92 阅读 · 0 评论 -
CSS基础介绍(三)
文章目录display属性overflow属性文档流浮动简单布局display属性通过display样式可以修改元素的类型可选值作用inline可以将一个元素作为内联元素显示block可以将一个元素设置为块元素显示inline-block将一个元素转换为行内块元素 1none隐藏元素,并且元素不会再页面中继续占有位置两种隐藏元素的方法display:none; 使用该方式隐藏元素,元素不会再页面显示,并且不再占据页面位置visibili原创 2021-05-02 18:55:32 · 205 阅读 · 0 评论 -
盒子模型
文章目录盒子模型内容区边框内边距外边距浏览器默认样式内联元素的盒子模型盒子模型一个盒子我们会分成四个部分:内容区(content)内边距(padding)边框(border)外边距(margin)如图:内容区使用width来设置盒子内容区的宽度使用height来设置盒子内容区的高度width和height只是设置了内容区的大小,而不是盒子整个的大小盒子可见边框的大小由内容区,内边距和边框共同决定边框大部分浏览器中,边框的宽度和颜色都是有默认值的,而边框的样式默认值都原创 2021-04-25 18:39:23 · 117 阅读 · 0 评论 -
CSS基础介绍
文章目录1.CSS简介1.CSS简介CSS(Cascading Style Sheets)层叠样式表CSS可以用为网页创建样式表,通过样式表可以对网页进行装饰。所谓层叠,可以将网页想象成是一层一层的结构,层次高的会覆盖层次低的。而CSS就可以分别为网页的各个层次设置样式。...原创 2021-04-17 20:28:39 · 204 阅读 · 0 评论