![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
文章平均质量分 68
冰雪奇缘lb
这个作者很懒,什么都没留下…
展开
-
高度塌陷、BFC、clear
高度塌陷问题在浮动布局中,父元素的高度默认是被子元素撑开的,当子元素浮动后,其会完全脱离文档流,子元素从文档流中脱离将会无法撑起父元素的高度,导致父元素的高度丢失。父元素高度丢失以后,其下的元素会自动上移,导致页面的布局混乱。所以高度塌陷是浮动布局中比较常见的一个问题,这个问题我们必须要进行处理。举例如下:<!DOCTYPE html><html> <head> <meta charset="utf-8">原创 2021-08-19 14:36:58 · 134 阅读 · 0 评论 -
flex布局
传统布局与flex布局传统布局兼容性好布局繁琐局限性,不能再移动端很好的布局flex弹性布局操作方便,布局极为简单,移动端应用很广泛PC端浏览器支持情况较差IE11或更低版本,不支持或仅部分支持建议︰如果是PC端页面布局,我们还是传统布局。如果是移动端或者不考虑兼容性问题的PC端页面布局,我们还是使用flex弹性布局。布局原理采用Flex布局的元素,称为Flex容器( flex container ),简称"容器"。它的所有子元素自动成为容器成员,称为Flex项目(原创 2021-08-17 10:40:24 · 92 阅读 · 0 评论 -
CSS制作“三角”(对话框突出部分)
CSS制作“三角”看以下的css渲染结果:.box1 { width:0; height: 0; border-top: 10px solid pink; border-right: 10px solid red; border-bottom: 10px solid blue; border- left: 10px solid green;}简单修改以下,只保留一个:.box2 { width: 0; height: 0; border: 10px solid trans原创 2021-06-27 16:15:28 · 283 阅读 · 0 评论 -
css中的定位
CSS定位** 定位组成**定位∶将盒子定在某一个位置,所以定位也是在摆放盒子,按照定位的方式移动盒子。定位=定位模式+边偏移。定位模式用于指定一个元素在文档中的定位方式。边偏移则决定了该元素的最终位置。边偏移边偏移就是定位的盒子移动到最终位置。有top、bottom、left和right 4个属性。静态定位static静态定位是元素的默认定位方式,无定位的意思。语法︰{ position: static; }静态定位按照标准流特性摆放位置,它没有边偏移静态定位在布局时很少用原创 2021-06-27 16:09:08 · 82 阅读 · 1 评论 -
CSS的复合选择器
CSS的复合选择器后代选择器子选择器并集选择器使用举例:div,p,.pig li { color: pink;}注意:约定的语法规范,我们并集选择器喜欢竖着写最后一个选择器不需要加逗号伪类选择器伪类选择器用于向某些选择器添加特殊的效果,比如给链接添加特殊效果,或选择第1个,第n个元素。伪类选择器书写最大的特点是用冒号(∶)表示,比如 :hover 、:first-child。因为伪类选择器很多,比如有链接伪类、结构伪类等,所以这里先给大家讲解常用的链接伪原创 2021-06-26 21:56:38 · 53 阅读 · 1 评论