渐变,文字阴影,文本溢出换行和特殊字体的使用

线性渐变：background: linear-gradient(to right top, red, yellow, skyblue);

径向渐变：background: radial-gradient(red, yellow, blue);

position渐变方向,不给方向默认是从上到下,

顺序从哪里来是相反的bottom对应top ,right对应left

 

 

 文字阴影:

文字阴影: X轴偏移 Y轴偏移 模糊大小 阴影颜色 

text-shadow: 3px 3px 3px yellow;

 

 文本溢出,换行:

文本溢出: overflow: hidden;

text-overflow: ellipsis;没有写完的文字用省略号

display: -webkit-box;设置两行后省略号盒子属性必须设置为这个 

文本不会换行   white-space: nowrap

webkit-line-clamp: 2;表示2行后超出省略号 

 word-break: break-all; 破坏单词整体性,可以换行显示

webkit-box-orient: vertical;盒子多行展示文字是垂直展示,多行文字展示下使用

 

 特殊字体:

     @font-face

            /* 四个是针对不同的浏览器兼容 */

            font-family: ywstlye;(自命名)