CSS——常见属性和外部样式表(外链式)

常见属性:


	
	Document
	


	

这是一个标题

这是一个段落

css可以写在head里面,也可以写在单独的文件里面。
语法:< style type=“text/css”>< /style>
type表示“类型”,text就是“纯文本”。
sublime中输入< st+tab键 可以自动生成style type。

CSS对换行不敏感,对空格也不敏感,但是语法一定要标准,冒号分号都不能省略。
语法:

	.选择器1{
			标签: 样式;
			标签: 样式;
			标签: 样式;	
	}
	.选择器2{
			标签: 样式;
			标签: 样式;
			标签: 样式;
	}	

字体颜色:
color: red;
color属性的值可以是英语,如常见的red, yellow, blue, 也可以是lightyellow, skyblue等单词,也可以是rgb和十六进制。
sublime中快捷键是c+tab

背景颜色:
background-color: blue;
sublime中快捷键是bgc+tab

text-align设置文本内容的水平对齐。left:左对齐(默认值);right:右对齐;center:居中对齐。

text-indent首行缩进,其属性值可为不同单位的数值、em字符宽度的倍数或相对于浏览器窗口宽度的百分比%,允许使用负值,建议使用em作为设置单位,1em就是一个字的宽度。

text-decoration文本装饰。下划线:text-decoration: underline;无下划线: text-decoration: none;

font属性
使用font属性,能够一起设置字号、行高、字体:
font: 14px/24px “宋体”;size是尺寸,px是像素;等价于三行语句:

font-size: 14px;
line-height: 24px;
font-family:"宋体";

font-family就是“字体",但不是所有字体都能用,因为这个字体要看用户的电脑里装没装。

比如设置font-family:“华文彩云”;如果用户电脑里没有这个字体,那么就会变成宋体。

页面中,中文只使用:微软雅黑、宋体、黑体。如果页面中需要其他字体,那么需要切图。英语:Arial、Times New Roman

为了防止用户电脑里面没有微软雅黑这个字体,那么就要用英语的逗号隔开备选字体,即如果用户电脑里面没有安装微软雅黑字体,那么就是宋体:font-family:“微软雅黑”, “宋体”; 备选字体有无数个,用逗号隔开。

我们要将英语字体放在最前面,这样所有的中文就不能匹配英语字体,就自动变为后面的中文字体:font-family: “Times New Roman”,“微软雅黑”,“宋体”。

所有的中文字体,都有英语别名:微软雅黑的英语别名:font-family: “Microsoft YaHei”; 宋体的英语别名:font-family: “SimSun”;

font属性能够将font-size、line-height、font-family合三为一:font: 12px/30px “Times New Roman”,“Microsoft YaHei”,“SimSun”;

行高可以用百分比,表示字号的百分之多少。一般来说都是大于100%,因为行高一定要大于字号。

font: 12px/200%“宋体”;等价于font: 12px/24px"宋体"; 反过来,比如: font: 16px/48px"宋体";等价于font: 16px/300%“宋体”;

尽量使用偶数字号,各字体之间必须使用英文状态下的逗号隔开,中文字体需要加英文状态下的引号,英文字体一般不需要加引号。

当需要设置英文字体时,英文字体名必须位于中文字体名之前。如果字体名中包含空格、#、¥等符号,则该字体必须加英文状态下的单引号或双引号,如font-family: “Times New Roman”;。

fount-weight: 字体粗细
可用属性值:normal/bold/bolder/lighter/100~900(100的整数倍)
数字400等价于normal,而700等价于bold

font-style: 字体风格
如设置斜体、倾斜或正常字体,可用属性值如下:
normal:默认值,显示标准字体样式;italic:显示斜体的字体样式;oblique:显示倾斜的字体样式。

外部样式表(外链式)
嵌入式是将所有样式放在一个或多个以.CSS为扩展名的外部样式表文件中,通过link标签将外部样式表文件链接到HTML文档中,其基本语法格式:


	

该语法中,link标签需要放在head头部标签中,且必须指定link标签的三个属性:
href:定义所链接外部样式表文件的URL,可以是相对路径,也可以是绝对路径。
type:定义所链接文档的类型,这里需要指定为"text/CSS",表示链接的外部文件为CSS样式表。
rel:定义当前文档与被链接文档之间的关系,这里需要指定为"stylesheet",表示被链接的文档是一个样式表文件。

你可能感兴趣的:(css,学习笔记)