CSS 周总

認＆椉φ

于 2023-10-15 16:22:50 发布

阅读量83

点赞数

文章标签： css 前端

本文链接：https://blog.csdn.net/qq_73700909/article/details/133842611

版权

css文本属性

1.文本的缩进

text-indent 属性将⻚⾯上的段落的第⼀⾏进行缩进(首行缩进)，这是⼀种最常⽤的⽂本格式化效果

取值：

：⽤⻓度值指定⽂本的缩进。可以为负值。
：⽤百分⽐指定⽂本的缩进。可以为负值。

2.text-align

text-align属性设置⽂本⽔平对⻬⽅式。取值：

left：内容左对⻬。

center：内容居中对⻬。

right：内容右对⻬。

justify：内容两端对⻬，对最后⼀⾏⽆效

li-01 {
    text-align:left;
}

li-02 {
    text-align:right;
}

li-03 {
    text-align:center;
}

li-04 {
    text-align:justify;
}

文本的修饰

1.text-decoration

text-decoration 属性设置⽂本装饰线条的位置，综合属性可以单独设置 text-decoration-line、 text-decoration-color 和 text-decoration-style 属性 text-decoration-line

none 指定⽂字⽆装饰
underline 指定⽂字的装饰是下划线
overline 指定⽂字的装饰是上划线
line-through 指定⽂字的装饰是贯穿线

可以组合多个值

text-decoration-style

在文本上下方同时显示线条 text-decoration-style

solid 线条显示为单行
double 线条显示为双线
dotted 线条显示为点线
dashed 线条显示为虚线
wavy 线条显示为波浪线

单词间距

1.word-spacing

word-spacing 属性设置英⽂单词之间的间距取值：
normal：默认间隔
：⽤⻓度值指定间隔。可以为负值
p {
    word-spacing:20px;
}

文本间距

1.letter-spacing

letter-spacing 属性设置字符之间的间距，适⽤于中英⽂⽂本取值：

normal：默认间隔
：⽤⻓度值指定间隔。可以为负值

文本换行

1.word-wrap 让文字换行

word-wrap 属性设置⽂本内部⻓单词或URL换⾏取值：

normal 默认值（浏览器保持默认处理）。
break-word 在⻓单词或 URL 地址内部进⾏换⾏

2. word-break

word-break 属性设置⾃动换⾏的处理⽅法取值：

normal 使⽤浏览器默认的换⾏规则。
break-all 允许在单词内换⾏。
keep-all 只能在半⻆空格或连字符处换⾏。

3. white-space 不允许文字换行

nowrap:文本不会换行，文本会在在同一行上继续，直到遇到 < br >标签为止。

4. text-overflow 当文本溢出包含元素时剪切文字

ellipsis 显示省略符号来代表被修剪的文本。

文字阴影 text-shadow

text-shadow 属性向文本设置阴影

语法：text-shadow: x-shadow y-shadow blur color;

x-shadow 必需。水平阴影的位置。允许负值。
**y-shadow 必需。垂直阴影的位置。允许负值。
**blur 可选。模糊的距离。
**color 可选。阴影的颜色。

x-shadow	必需。水平阴影的位置。允许负值。
**y-shadow	必需。垂直阴影的位置。允许负值。
**blur	可选。模糊的距离。
**color	可选。阴影的颜色。

css伪类和伪元素

一，伪类和伪元数

伪类定义：伪类⽤于向某些选择器添加特殊的效果

1.超链接（A）伪类

a标签

a:link {color:#FF0000;} /* 未访问的链接 */
a:visited {color:#00FF00;} /* 已访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标划过链接 */
a:active {color:#0000FF;} /* 已选中的链接 */

其他常⻅的伪类选择器 :focus :checked :first-child :last-child等

2。元素

伪元素不是真正的元素，不存在与⽂档之中，所以 js ⽆法对它进行操作。为什么叫他“元素”？因为我们可以对其进⾏跟元素⼏乎⽆差别的操作

:first-child  /* 第一个子元素 */
:last-child  /* 最后一个子元素 */
:only-child /* 只有一个子元素 */
:root  /* 根标签 */
:nth-child(n)   /* 第几个子元素 */
ul li:nth-child(1){color:#f00;}   /* 第一个子元素 - 从1开始 */ 
ul li:nth-child(2n){color:#f00;} /* 偶数行的子元素 - 2的倍数的所有元素 */ 
:nth-child(odd)  /* 奇数元素 */
:nth-child(even)  /* 偶数元素 */
:nth-last-child(-n+4)

3.伪类

定义：CSS伪元素是⽤来添加⼀些选择器的特殊效果。最好使⽤双冒号，防⽌与伪类混淆

1.first-letter首字母

first-letter 伪元素⽤于向⽂本的⾸字⺟设置特殊样式

例子：p::first-letter {color: red;}

其他常⻅的伪元素选择器

::first-line 首行
::first-letter 首字母
::before 元素前插入
::after 元素后插入

2.before与after的用法

before定位的基准是其主元素的右上⻆，after定位的基准是主元素的结尾处。当主元素没有内容时before与after仍会正常⼯作，属性为行内元素，若需要设置⾼宽度等属性需要首先设置为块元素。 content是伪元素必需的属性。若伪元素没有内容，需赋值为空格：content:' '; before与after的主要⽤途是对元素默认样式的的美化：美化时需要结合定位于内容。⼀般讲主元素设置为position：relative，伪元素设置为position：absolute，以⽅便对伪元素定位。
a:hover::before,
a:hover::after {
    position: absolute;
}

a:hover::before {
    content: "我是前"; left: -20px;
}

a:hover::after {
    content: "我是后"; right: -20px;
}

伪类与伪元素区别

伪类的操作对象是文档树中已有的元素，而伪元素则创建了一个文档数外的元素。因此，伪类与伪元素的区别在于：有没有创建一个文档树之外的元素

CSS3规范中的要求使用双冒号(::)表示伪元素，以此来区分伪元素和伪类，比如::before和::after等伪元素使用双冒号(::)，:hover和:active等伪类使用单冒号(:)。除了一些低于IE8版本的浏览器外，大部分浏览器都支持伪元素的双冒号(::)表示方法。除了少部分伪元素，如::backdrop必须使用双冒号，大部分伪元素都支持单冒号和双冒号的写法，比如::after，写成:after也可以正确运行。建议使用双冒号的写法，更容易识别出是伪类还是伪元素。

列表样式

1.list-style

list-style-type 设置列表标记样式

默认值: disc（实⼼圆）
circle（空⼼圆）
square（⽅形）
decimal（0开头的数字标记）
lower-roman（小写罗马数字）
upper-roman（大写罗马数字）

list-style-position 设置在何处放置列表标记

默认值: outside
inside 列表项目标记放置在文本以内，且环绕文本根据标记对齐。

list-style-image 设置使⽤图像来替换列表项的标记

none 不指定图⽚，默认内容标记将被 list-style-type 代替
url 使⽤绝对或相对地址指定列表项标记图⽚，如果图像地址⽆效，默认内容标记将被 list-style-type 代替

ul {
    list-style-type:square;
    list-style-position: inside;
    list-style-image:url('');
}

display和overflow

1.disply

display 属性规定元素应该⽣成的框的类型

none 不显示元素
block 转换为块元素
inline 转换为行内元素
inline-block 转换为行内块元素
table-cell 转换为table中的td格式，可以设置文字垂直方向的对其方式vertical-align: bottom;

2.overflow

overflow 属性规定当内容溢出元素框时发⽣的事情

visible 不变
hidden 超出隐藏
scroll 滚动条显示内容
auto 超出显示滚动条

css盒模型和box-sizing

1.width 宽度

width 属性设置元素的宽度说明：这个属性定义元素内容区的宽度，在内容区外⾯可以增加内边距、边框和外边距取值：

auto 元素实际宽度
length 设置像素级px宽度
% 基于父级元素的百分比宽度
inherit 从父级元素继承宽度，也就是等于父级元素的宽度

2.height 高度

height属性设置元素的⾼度注意：height属性不包括填充，边框，或边距取值：

auto 元素实际高度
length 设置像素级px高度
% 基于父级元素的百分比高度
inherit 从父级元素继承高度，也就是等于父级元素的高度

3.css内边距

padding 简写属性在⼀个声明中设置所有内边距属性

说明：这个简写属性设置元素所有内边距的宽度，或者设置各边上内边距的宽度。⾏内⾮替换元素上设置的内边距不会影响⾏⾼计算。如果⼀个元素既有内边距⼜有背景，从视觉上看可能会延伸到其他⾏，有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。

补充：

非替换元素：如果元素的内容包含在文档中，则称之为非替换元素。比如一个段落的文本都在该元素本身之内，这个段落就是一个非替换元素。
替换元素：作为其他内容占位符的一个元素称为替换元素，根据标签和属性的值来显示内容的元素。比如img元素，它只是指向一个图像文件，这个文件插入到文档流中。大多数表单元素（input，根据type属性来显示内容）也是替换元素。

注意：不允许指定负边距值。

取值：

auto 自动计算内边距
length 设置像素级px内边距
% 基于父级元素宽度的百分比的内边距
inherit 从父级元素继承内边距

4.CSS外边距

margin 简写属性在⼀个声明中设置所有外边距属性。该属性可以有 1 到 4 个值，与内边距相同说明：这个简写属性设置⼀个元素所有外边距的宽度，或者设置各边上外边距的宽度。块级元素的垂直相邻外边距会合并，⽽⾏内元素实际上不占上下外边距，⾏内元素的的左右外边距不会合并。同样，浮动元素的外边距也不会合并。允许指定负的外边距值，不过使⽤时要⼩⼼。注意：允许使⽤负值。

取值：

auto 自动计算外边距
length 设置像素级px外边距
% 基于父级元素宽度的百分比的外边距
inherit 从父级元素继承外边距

列1

p {
    /* 上外边距是 10px 右外边距是 5px 下外边距是 15px 左外边距是 20px */
    margin:10px 5px 15px 20px;
    /* 上外边距是 10px 右外边距和左外边距是 5px 下外边距是 15px */
    margin:10px 5px 15px;
    /* 上外边距和下外边距是 10px 右外边距和左外边距是 5px */
    margin:10px 5px;
    /* 4 个外边距都是 10px */
    margin:10px;
}

5.6.CSS边框（border）

border 简写属性在⼀个声明设置所有的边框属性可以按顺序设置如下属性：

border-width
border-style
solid 实线
dotted 点状线
double 双实线
dashed 虚线
border-color


p {
    border:5px solid #ff0000;
}
/* 设置每⼀条边框的样式 */
p {
    border-top:10px solid red;
    border-left:20px dotted green;
    border-right:30px double orange;
    border-bottom:40px dashed red;
}
/* css画一个三角形 */
div {
    width:0;
    height:0;
    border:10px solid transparent;
    border-top-color:red;
}

6.border-radi

border-radius 属性是一个简写属性，用于设置四个 border- *-radius 属性。
border-radius: 1-4 length|% / 1-4 length|%;

盒子模型

1.定义：

盒模型通过一个模型来描述元素在页面中占用的空间。

W3C 标准模型元素的设置宽度和设置高度指内容的宽度和高度
元素总宽度=设置宽度+左填充+右填充+左边框+右边框+左边距+右边距
元素总高度=设置高度+顶部填充+底部填充+上边框+下边框+上边距+下边距
IE模型元素的设置宽度和设置高度包括内容的宽度和内边距以及边框宽高
元素总宽度=设置宽度+左边距+右边距
元素总高度=设置高度+上边距+下边距

2. box-sizing属性

box-sizing 属性允许您以特定的⽅式定义匹配某个区域的特定元素。取值：

content-box 指定盒模型为 W3C 标准模型，元素的宽度 = 设置宽度 + 边框宽度 + 内边距
border-box 指定盒模型为 IE模型，元素的宽度 = 设置宽度 - 边框宽度 - 内边距
inherit 从父元素继承 box-sizing 属性值

背景属性

1.background 背景属性

background 设置背景的显示方式，是一个间歇属性

设置顺序为：background-color background-image background-repeat background-attachment background-position

可以设置如下属性：

background-color 背景颜色
background-image 背景图片
background-repeat 背景平铺方式
background-attachment 背景图片固定方式
background-position 背景图片位置
background-size 背景图片尺寸
background-origin 背景图片显示区域
background-clip 背景显示区域
inherit 继承父元素的背景属性样式

2.background-color

background-color 属性设置元素的背景颜⾊

元素背景范围 background-color 属性为元素设置⼀种纯⾊。这种颜⾊会填充元素的内容、内边距和边框区域，扩展到元素边框的外边界（但不包括外边距）。如果边框有透明部分（如虚线边框），会透过这些透明部分显示出背景⾊。

取值：

transparent 默认，透明背景
color_name 颜色名称，比如red
hex_number 十六进制颜色，比如#ff000
rgb_number rgb色值，比如rgb(255,0,0)或者rgba(255,0,0,.2)
inherit 继承父元素背景色

背景图片

background-image 属性设置元素的背景图⽚，元素的背景占据了元素的全部尺⼨，包括内边距和边框，但不包括外边距。默认，背景图像位于元素的左上⻆，并在⽔平和垂直⽅向上重复。
p {
    background-image:url("./img.jpg")
}

background-repeat 背景平铺

background-repeat 属性设置是否重复背景图像。取值：

repeat 默认值，⽔平垂直⽅向上平铺
no-repeat 不平铺
repeat-x ⽔平⽅向平铺
repeat-y 垂直⽅向平铺

background-attachment 背景图片固定

background-attachment 属性设置背景图像是否固定或者随着⻚⾯的其余部分滚动。取值：

scroll 默认值。背景图像会随着⻚⾯其余部分的滚动⽽移动
fixed 当页面的其余部分滚动时，背景图像不会滚动

background-position 背景定位

background-position 属性设置背景图像的起始位置。这个属性设置背景原图像的位置，背景图像如果要重复，将从这⼀点开始。取值：

上下左右第一个位置定义上下的位置（top/center/bottom），第二个定义左右位置(left/center/right)，如果仅定义一个值，第二个值为 center
x y 第一个值为水平位置，第二个为垂直位置，可以是百分比或者px，如果仅定义一个值，第二个值为50%

background-s 背景图片尺寸

background-size 属性规定背景图像的尺寸。取值：

length 设置背景图像的高度和宽度。第一个值设置宽度，第二个值设置高度。如果只设置一个值，则第二个值会被设置为 "auto"。
percentage 以父元素的百分比来设置背景图像的宽度和高度。第一个值设置宽度，第二个值设置高度。如果只设置一个值，则第二个值会被设置为 "auto"。
cover 把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中。
contain 把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。

background-origin 背景图片显示区域

background-origin 属性规定 background-position 属性相对于什么位置来定位。注意：如果背景图像的 background-attachment 属性为 "fixed"，则该属性没有效果。取值：

padding-box 默认值，背景图像相对于内边距定位
border-box 背景图像相对于边框定位
content-box 背景图像相对于内容边框定位

background-clip背景显示区域

background-clip 属性规定背景的绘制区域。取值：

border-box 默认值，背景填充全部
padding-box 背景填充不包括边框
content-box 背景只填充内容部分

定位

1.定义：

position 属性指定了元素的定位类型

取值：

static 静态定位【默认值】
relative 相对定位
absolute 绝对定位
fixed 固定定位
sticky 粘性定位

2.static 定位

HTML 元素的默认值，即没有定位，遵循正常的⽂档流对象。静态定位的元素不会受到 top, bottom, left, right影响。
.static {
    position:static;
    background-color:red;
}

3.relative 定位

相对定位元素的定位是相对自身的正常位置。移动相对定位元素，但它原本所占的空间不会改变。相对定位元素经常被⽤来作为绝对定位元素的容器块。

.relative {
    position:relative;
}

4.absolute 定位

绝对定位的元素的位置相对于最近的已定位⽗元素，如果元素没有已定位的⽗元素，那么它的位置相对于文档定位。 absolute 定位使元素的位置与⽂档流⽆关，因此不占据空间。 absolute 定位的元素和其他元素重叠。

.absolute {
    position:absolute;
    left:20px;
    top:20px;
}

5.fixed 定位

元素的位置相对于浏览器窗⼝是固定位置。即使窗⼝是滚动的它也不会移动。

6.sticky 定位

基于⽤户的滚动位置来定位
在未滚动出目标区域时，类似 position:relative;
当⻚⾯滚动超出⽬标区域时，类似 position:fixed;，它会固定在⽬标位置。
元素定位表现为在跨越特定阈值前为相对定位，之后为固定定位

这个特定阈值指的是 top, right, bottom 或 left 之⼀，换⾔之，指定 top, right, bottom 或 left 四个阈值其中之⼀，才可使粘性定位⽣效。否则其⾏为与相对定位相同。注意: Internet Explorer, Edge 15 及更早 IE 版本不⽀持 sticky 定位。 Safari 需要使⽤ -webkit- prefix。

堆叠的元素

元素的定位与⽂档流⽆关，所以它们可以覆盖⻚⾯上的其它元素
z-index属性指定了⼀个元素的堆叠顺序（哪个元素应该放在前⾯，或后⾯）
⼀个元素可以有正数或负数的堆叠顺序

具有更⾼堆叠顺序的元素总是在较低的堆叠顺序元素的前⾯。注意：如果两个定位元素重叠，没有指定z - index，最后定位在HTML代码中的元素将被显示在最前⾯。

层级

总结：标准流盒子，低于浮动的盒子，浮动的盒子又低于定位的盒子。定位高于浮动，浮动高于标准流。（高低和占不占位置无关）给定 z-index 的值为层级的值。（不给默认为0）

层级为 0 的盒子，也比标准流和浮动高
层级为负数的盒子，比标准流和浮动低
层级不取小数
层级一样，后面的盒子比前面的层级高
浮动或者标准流的盒子，后面的盒子比前面的层级高
abselute是不占位置的，relative是站位的。而层级的高低，是和占不占位置没有关系的。

透明

1.rgba 作用于颜色

语法：rgba(R,G,B,A); RGBA 是代表Red（红色） Green（绿色） Blue（蓝色）和 Alpha（不透明度）三个单词的缩写。RGBA 颜色值是 RGB 颜色值的扩展，带有⼀个 alpha 通道 - 它规定了对象的不透明度。

rgba()里的值的介绍：

R：红色值。正整数（0~255）
G：绿色值。正整数（0~255）
B：蓝色值。正整数（0~255）
A：透明度。取值0~1之间

rgba()只是单纯的可以设置颜色透明度，这样在页面的布局中有很多应⽤。比如说：让背景出现透明效果，但上面的文字不透明。

2. opacity属性设置背景透明度

语法：opacity: value; value 指定不透明度，从0.0（完全透明）到1.0（完全不透明）。 opacity 属性具有继承性，会使容器中的所有元素都具有透明度；

<style>
    .box{
        width:400px;
        height:400px;
        margin: 0 auto;
    }
    .box-item{
        float:left;
        width:120px;
        height:120px;
        margin:20px;
        background:#ff0000;
    }
    .box-item.item01{
        opacity:.4;
    }
    .box-item.item02{
        opacity:1;
    }
</style>
<div class="box">
    <div class="box-item item01">背景透明</div>
    <div class="box-item item02">背景不透明</div>
</div>

3.

rgba() 方法与opacity方法可以实现透明度效果
rgba()只作用于元素的颜色或其背景色（设置了rgb(）透明度元素的子元素不会继承其透明效果）
opacity具有继承性，既作用于元素本身，也会使元素内的所有子元素具有透明度

元素隐藏的六种方法

1.使用透明度 opacity

语法：opacity:0 注意：元素消失，但是还会占据空间

2.使用display

display:none 注意：元素消失，不会占据空间

3.使用 scale 缩放

transform:scale(0) 注意：元素消失，但是还会占据空间

4.使用visibility

visibility:hidden 隐藏 / visible显示注意：元素消失，但是还会占据空间

5.使用宽高和overflow

width:0;overflow:hidden; 注意：元素消失，但是还会占据空间
<style>
  .box{
    width: 0px;
    height: 0px;
    background-color: aquamarine;
    overflow:hidden;
    visibility:hidden;
  }
</style>
<div class="box"></div>

6.使用position定位

position:absolute; top:-当前元素的高度；left：-当前元素的高度注意：元素消失，不会占据空间

光标属性

1.cursor 属性规定要显示的光标的类型（形状）。该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状（不过 CSS2.1 没有定义由哪个边界确定这个范围）。

属性名效果
crosshair 精确定位“十”字形；
pointer “小手”形状
text 文本“I”形；
wait 等待，“沙漏”形；
default 默认指针；
help 帮助，带尾箭头
auto 鼠标按照默认的状态根据页面上的元素自行改变样式

属性名	效果
crosshair	精确定位“十”字形；
pointer	“小手”形状
text	文本“I”形；
wait	等待，“沙漏”形；
default	默认指针；
help	帮助，带尾箭头
auto	鼠标按照默认的状态根据页面上的元素自行改变样式

<style>
 .one{
    width: 100px;
    height: 100px;
    background-color: green;
    float: left;
  }
  .one:hover{
    cursor: pointer;
  }
 </style>
<div class="one">one</div>

flex弹性盒子

W3C提出了一种崭新的方案----Flex布局（即弹性伸缩布局），它可以简便、完整、响应式地实现各种页面布局，包括一直让人很头疼的垂直水平居中也变得很简单地就迎刃而解了。伸缩布局 = 弹性布局 = flex布局原理：通过给父盒子添加flex属性，来控制盒子的位置和排列方式弹性盒子分为两块：box布局（老版本）和flex布局（新版本） Flexbox模型是2012年9月提出的工作草案，这个草案是由W3C 推出的最新语法。这个版本立志于指定标准，让新式的浏览器全面兼容，在未来浏览器的更新换代中实现统一。

注意，设为 Flex 布局以后，子元素的 float、clear 和 vertical-align 属性将失效。

容器: 采用 Flex 布局的元素，称为 Flex 容器（flex container），简称"容器

项目容器的所有子元素自动成为容器成员，称为 Flex 项目（flex item），简称"项目“

容器属性(6 个): 项目属性（6个）
flex-direction 主轴方向 order
flex-wrap 主轴换行方式 flex-grow
flex-flow 符合形式 flex-shrink
justify-content 主轴对齐方式 flex-basis
align-items 交叉轴对齐方式 flex
align-content 多根主轴对齐方式 align-self

容器属性(6 个):	项目属性（6个）
flex-direction 主轴方向	order
flex-wrap 主轴换行方式	flex-grow
flex-flow 符合形式	flex-shrink
justify-content 主轴对齐方式	flex-basis
align-items 交叉轴对齐方式	flex
align-content 多根主轴对齐方式	align-self

flex基础弹性盒子

语法：display：flex 表示给当前元素添加弹性盒子

display:-webkit-box;和float的区别在于 float浮动之后，高度会随着内容变化,高度不定；并且浮动之后，当盒子缩小时，浮动的内容会自动被挤下来 display:box 不需要设置盒子高度，会自动使多个盒子高度保持一致；并且弹性盒子设置好之后，屏幕缩小不会让内容自动换行，但是还是没有实线弹性盒子

flex-direction 决定主轴方向（即项目排列方向）

属性值： row（默认值）：主轴为水平方向，起点在左端。 row-reverse：主轴为水平方向，起点在右端。 column：主轴为垂直方向，起点在上沿。 column-reverse：主轴为垂直方向，起点在下沿

flex-wrap 设置项目换行方式[使用的多

默认情况下，项目都排在一条线(又称”轴线”)上。 flex-wrap 属性设置如果一条轴线排不下，项目如何换行。

语法：flex-warp：warp nowrap （默认）：不换行,都在一行或者一列中显示 wrap：换行，第一行在上方。 wrap-reverse：伸缩项目无法容纳时，自动换行，方向和wrap相反,这个效果和使用float的效果是一样的。

CSS选择器

| **选择器** | **例子** | **例子描述** | **CSS** |

| --------------------------- | ----------------- | -------------------------------------------------------------------------------- | -------- |

| #\*\**id* | #firstname | 选择 id="firstname" 的所有元素。 | 1 |

| \* | \* | 选择所有元素。 | 2 |

| \*\**element* | p | 选择所有元素 | 1 |

| ------------------ | -------------- | ---------------------------- | - |

| **选择器** | **例子** | **例子描述** | **CSS** |

| -------------------------------- | ------------------------------------ | ------------------------------- | -------- |

| ***element1*\~***element2* | p\~ul | 选择前面有元素(同胞，可以不相邻)的每个 | 3 |

| :last-child | p:last-child | 选择属于其父元素最后一个子元素每个

認＆椉φ

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS 周总

属性将⻚⾯上的段落的第⼀⾏进行缩进(首行缩进)，这是⼀种最常⽤的⽂本格式化效果text-align属性设置⽂本⽔平对⻬⽅式。取值：left：内容左对⻬。center：内容居中对⻬。right：内容右对⻬。justify：内容两端对⻬，对最后⼀⾏⽆效。
复制链接

扫一扫