CSS路径属性,CSS和常用属性总结

CSS总结

什么是CSScss是层叠样式表，可以对网页进行修饰和渲染的一门技术。

如何在网页中使用CSS1.直接使用(不推荐)原因：标签中的属性很多，会造成页面混乱，并且不能被复用。

通过标签上的style属性给div设置样式边框:2px solid red

字体大小:26px

背景颜色为:pink

这是一个div...

`

这是一个div...

`2.在< head>中通过< style>标签引入CSS

实现了代码的分离和复用，初步实现了代码的分离。

span{

border:2px solid blue;

font-size:22px;

background:red;

}

3.使用link连接引用外部CSS文件

在html中引入css文件

xx.css文件@charset "utf-8";

span{

border:2px solid blue;

font-size:22px;

background:red;

}

CSS选择器1.通过元素名(标签名)选择指定名称所有被选中的标签span{}

div{}2.class选择器

每个标签都可以设置一个class属性值，通过选择class的值选择。.s1{}

.s2{}

*如果一个标签的class值由多个 < span class = "s1 s2">，s2的设置会覆盖s1的设置。3.id选择器

也可以根据id的属性值选择标签。#d1{}

#d2{}4.后代选择器

格式：祖先 后代{}div p{ /* 匹配所有div中的p标签*/

}

常用属性

文本属性1.text-align:设置元素内的文本内容对齐方式。

2.text-decoration：设置文本的下划线方式。

3.text-indent：设置文本的缩进，单位：px/%。

4.letter-spacing：设置字符间距。

5.text-shadow:x(水平位移)x(垂直位移) x(阴影扩散值) x(颜色);设置文本阴影。

字体属性1.font-siez:字体大小。

2.font-weight:文字粗细。

3.font-family：字体的格式。

4.color:字体颜色

背景属性background-color：背景颜色。

background-img：设置背景图片，url=“”

*background-repeat：设置或检索背景图片的排列方式(repeat默认值,repeat-x横向重复，no-repeat没有重复)background-position:设置或检索背景图片位置

background: 背景颜色 背景图片 背景图片是否重复 背景图片的位置

边框borderborder-width: 2px; -- 设置元素边框的宽度

border-style: solid; -- 设置元素边框的样式

border-color: red; -- 设置元素边框的颜色margin: 设置元素的外边距

display属性

display属性用来设置元素的类型；常用的值：block：块级元素的默认值

默认情况下独占一行

可以设置宽高

//比如: div/p/h1~h6/form/table 等元素都是块级元素

inline：行内元素的默认值

默认情况下多个行内元素可以处在同一行

一般不能设置宽高

//比如: span/input/img/i/b 等元素都是行内元素

inline-block：行内块元素

多个元素既可以显示在同一行, 也可以设置宽和高

none：表示隐藏元素