美文网首页
css方便以后使用

css方便以后使用

作者: 幽默的bug | 来源:发表于2019-08-14 17:55 被阅读0次

    本人觉得浮动挺好用的,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 );

    相关文章

      网友评论

          本文标题:css方便以后使用

          本文链接:https://www.haomeiwen.com/subject/rsmrkctx.html