GAARA

BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素；外面的元素也不会影响到容器里面的子元素；<mark>计算BFC的高度时，浮动元素也参与计算。</mark>

给.panel元素的四边上四个折线框,是通过一个个宽高10px的小div只显示两侧边框实现的上面两个可以直接给.panel添加伪元素选择器::before和::after下面两个可以再给.panel套一个div.panel-footer,同样给这个元素添加两个伪元素选择器设置定位:子绝父相

1.reset.css2.在线jQuery链接3.在线flexible.js链接4.在线引入vue.js

2021-09-06 解决高度塌陷的产生和解决方法总结27/100发布文章rowlet未选择任何文件new#### 高度塌陷的产生父盒子没有设置宽高导致其高度塌陷#### 解决方法1.给塌陷元素添加overflow:hidden2.给浮动元素下方添加一个空盒子3.万能清除法:```cssafter{content:".";clear:both;display:block;height:0;overflow:hidden;visibility:hidden;}```4.给父元素

新增特性总结1.颜色:rgba(透明度)2.文字阴影:box-shadow3.边框:border4.弹性盒子模型:box-sizing:border-box5.背景:background6.渐变7.自定义动画:animation8.媒体查询:9.伪元素:selection10.过渡:transition11.2d转换12.3d转换13.字体图标:icon-font14.弹性布局:display:flex15.选择器:nth-child()

1.从属关系:@import只有导入样式表的效果,而link不仅可以导入css文件还可以定义RSS,ref等2.加载顺序:@import引入的css在页面加载完毕后被加载,link标签引入的css是同时被加载3.兼容性:@import是CSS2.1的语法,需要IE5+中识别,link是HTML的元素标签,不存在兼容性问题4.权重:link引入的css样式权重大于@import引入的样式

sass使用$+变量名可以定义变量 // scss可以设置变量 // 定义变量:$符号＋名称 $goldenTea:#e0861a; //变量中也可以嵌套变量 $ul-border:2px solid $goldenTea; ul{ list-style-type: none; border:$ul-border; li{ background-color:$goldenTea; } }对于伪类选择器的嵌套,":“前面要加一个”&"嵌套伪类选择器时,css文件

1.对每一张图片设置css的变形:旋转属性,使其形成一个闭合图形2.设置动画,令图片的父盒子即闭合图形开始旋转

目的:1.实现响应式布局:页面布局随着浏览器缩放而缩放2:让1rem=100px步骤:(以750px的移动端屏幕为例)1.演算:让100vm=750px,即100%浏览器宽度视距再令1rem=100px,由此可以得到以下等式关系:1rem=13.33vm;2.设置font-sizehtml{ font-size:13.33vm;}3.把所有的px都改成rem如:div{ width:250px; height:40px;}改成:div{ width:2.5px;

1.文本垂直居中1.1.单行文本垂直居中行高=盒子高度 div { width: 300px; height: 150px; border: solid; /*设置水平居中*/ text-align: center; /*设置行高等于高度,可以让div中的单行文本垂直居中*/ line-height: 150px;

总结:实现多行文本居中需要将其转化成其他的形式方法一:子元素设置table-cell来模拟表格 .box { width: 300px; height: 400px; border: dashed; display: table-cell; vertical-align: middle; }或者:父元素设置display:t

IE:1.document.body.clientWidth/Height body对象的宽高2.document.documentElement.clientWidth/Height 可视区域的宽高3.document.documentElement.scrollTop/Left(有没有?) 垂直/水平方向滚动的值只读:1.clientWidth/Height 元素的可见宽高(=content+padding)2.clientLeft/Top 读取元素的borde

vertical-align可以用来给块元素设置垂直对齐方式,对于非行内块元素需要先转化成行内块元素  示例: <style> img { /* img已经是行内块元素 */ vertical-align: middle; } span { display: inline-block; vertical-al

css颜色样式的获取和使用1.获取颜色有三种设置方:第一种是颜色的英文单词,如red,blue等第二种是用16进制设置,如#00FD42等第三种是用rgb或rgba设置,如rgb(255,255,0)或rgba(55,41,201,0.5)其中:rgb分别对应的是red,green,blue,取值0~255a是透明度样式,取值范围0~1(涉及到色光三原色)没啥用的tip:可以利用调色原理获得想要的颜色比如红色和绿色可以调出黄色,所以黄色可以用rgb(255,255,0)表示2.利用获