本人觉得浮动挺好用的,flex有些用的很不错,但是操作起来没有浮动好操作,也许是还没掌握,还在学习中
清楚浮动
.clearFix:after{ content:''; clear:both; display:block;}
.fl{ float:left; display:inline;}
.fr{ float:right; display:inline;}
clearFix是给浮动的父级加的
移动端媒体查询,现在用的少了,第三方库支持的多移动端pc多都是自动响应的了,写在这里用时方便
@media screen and (max-width:最大宽度) and (min-width:最小宽度){……}
图片垂直居中(给图片的父级)
display:table-cell
vertical-align:middle
工作中常用但是就是记不住这些样式(伤脑筋)渐变只记录了线性渐变
background:linear-gradient()
filter:blur(10px) 模糊效果
background clip:背景裁剪区域
background origin:背景定位(相对内容)
background:linear-gradient(to bottom,#f65f57,#B4453A,#f65f57) no-repeat right/1px 15px;
border:样式(dotted点线,dashed虚线,solid实线,double双线)
white-space:nowrap;强制不换行
letter-spacing:16px文本间隔
cursor:pointer :鼠标变手型
超过两行显示省略号
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
超出以省略号显示
text-overflow:ellipsis; // 溢出时产生省略号的效果
overflow:hidden; //溢出内容为隐藏
white-space:nowrap; //强制文本在一行内显示
::selection 鼠标选中后的变化背景颜色和字体颜色
兼容性:
ie6-9的渐变色做法
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#B2FFFFFF', endColorstr='#00FFFFFF',GradientType=0 );
网友评论