4.13

Posted 2021-03-01 xiaokeai233

文本阴影:
text-shadow: x轴位置 Y轴位置 阴影大小 阴影颜色 注:如果想添加多个阴影每--组阴影以逗号分隔。
盒子阴影:
box-shadow: x y阴影的模糊度 阴影扩散的大小 阴影颜色 内阴影( inset：可选）
添加多阴影:以逗号分隔的形式添加多阴影
英文或者数字默认显示：如果没有换行的情况下：尝试把下一个长单词放在下一行显示。
word-wrap:break-word;
功能：把长单词换到下一行显示，如果在下一行还有超出的情况下自动断句。
word-break:break-all;
功能：粗暴的断句

background-origin:背景图的起始位置

padding-box;默认值( padding区域开始)

border- box;边框后面开始

content-box;从内容区域开始

background-clip:;背景的裁切(只显示哪个区域的背景)
border- box: ;默认值

padding-box: ;

content-box: ;

background -size:;控制背 景图的大小属性值:宽度高度
属性值的数值:
10px 10px
100% 100%

cover：按照背景图的比例放大到全部平铺在元素后面则停止
contain：按照比例放入，当宽或者高，达到容器最高则停止
border- image属性是一一个简写属性，用于设置以下属性:

border - image source 用在边框的图片的路径.

border - image - slice图 片边框向内偏移(不加单位)-

border- 1mage- repeat图像边框足否应平铺(repeat)、铺满(round)或拉仲(stretch)border- image- outset边框图像区域超出边框的量(值是一个倍数)

图片边框:

把张图片，当作.个边框就行显示。

border- image: ;简写

border- image- source州在边框的图片的路径。

border- image-slice图片边 框向内偏移(不加单位)。把图片切割成九宫格

border- image - repeat图像边框足否应平铺(repeat)、铺满( round)或拉伸
border - image- outset边框向外偏移

border-radius:半径!

一个値: 四周圆角

两个值:左. 上角及右下角

右上角及左下角

三个值:左上角 右上角及左下角 右下角

四个值:从左上角幵始順肘針没置。(左上右上右下左下)分垂直半径和水平半径:

border-radius:水平半径/垂直半径

width的属性值:

fill - availablefit ：合理分配有效剩余空间
fit- content：找子元素内容的宽度。按照子元素的宽度进行设置
max- content：找子元素最大的宽度
min- content：找子元素最小的宽度

面试题:

width:100%和width: fill-available;有什么区别? ? 答：对padding增加后的解析状态有影响。

calc(100% - 200px)：加减乘除都可以运算，但是都要用空格隔开。