CSS:一条或者多条以分隔号隔开的样式声明组成的。每条声明包含着一个CSS属性和该属性的值,二者以冒号分隔。
属性 | 说明 | 所在章节 | 解决 |
background-color | 设置背景元素的颜色 | 19 |
|
border | 设定围绕元素的边框 | 19 |
|
color | 设定元素的前景 | 24 |
|
font-size | 设置元素文字的自豪 | 22 |
|
height | 设置元素高度 | 20 |
|
padding | 设定元素内容与边框之间的间距 | 20 |
|
text-decoration | 设置元素文字的装饰效果,如下划线 | 22 |
|
width | 设置元素宽度 | 20 |
|
设置元素内嵌样式(style)
style是全局属性,比如
<ahref ="http://www.baidu.com"style="background-color:grey; color:white">
百度
</a>
(该处分别设置了超链接的背景色和前景色,仅限于该<a>到</a>之间)
style元素,(个人理解style元素和属性的分别是一个在head中一个在一个需要用到该样式的标签中,被调用的是一个已经设定好值的styel的时候就被称为元素)
<style type ="text/css">
a{
background-color:grey;
color:with;
}
span{
border:thin black solid;
padding:10px;
}
在此处,a和span,被称为选择器,之后的html文档中使用a元素的都会自动套用该样式
border属性设置围绕目标元素边框
padding属性控制的目标元素和边框之间的距离
外部样式表:.css文件
将a和span定义在一个。css文件中需要用到该样式的时候用link元素导入
<head>
<metacharset="utf-8" />
<title>css导入</title>
<link rel="stylesheet" type="text/css" href="styles.css"/>
</head>
当一个样式想要从一个样式表(.css文件)导入其他样式表的时候用@import
(computer.css文件中)
@import“styles.css”
span{
border : medium black dashed;
padding:10px;
}
自己顶一个样式不能出现在它之前;上样式中,先倒入了一个styles的样式又新定义了一个span样式
导入的时候直接导入
<link rel="stylesheet"type="text/css"
//link可写成<link/>(w3c推荐)或者<link></link>
href="computer.css"/>@import效率低处理起来往往不如处理多个link元素并靠样式层叠解决问题
在@import前出现的只能有@charset,用来表示编码类型
@charset“UTF-8”;
@import
//未声明的情况下采取默认的UTF-8编码