【Web前端笔记-基础】第五课·初识 CSS,CSS概述+选择器+属性

一：CSS定义

• 什么是CSS

CSS就是层叠样式表（Casading Style Sheets），通常称为CSS样式表，或者是级联样式表。主要用于设置HTML中的文本，内容（字体，大小，对齐），图片外形（宽高，边框样式，边距等），以及版面的布局等外观样式。

CSS以HTML为基础，提供了丰富的功能。还可以针对不同的浏览器设置不同的样式。

• HTML和CSS的关系

HTML结构层：负责从语义的角度搭建页面

CSS：负责从审美角度美化页面

• CSS的语法规则

CSS是由选择器和{}组成的，

大括号的是由一条条声明组成

每一条语句都是要英文状态下的声明，每一条声明都是由属性：值;组成

CSS属性值一般不加引号，但它的属性值为数字时一般要加单位，单位一般为px

CSS中，不能出行HTML标签

二：CSS的书写方式

CSS的书写分为嵌入式，外链式和行内式

• 嵌入式

嵌入式通过style标签，嵌入到HTML代码中来，如果使用HTML文档，style可以不写。

代码：

	
		
		
		
	
	
		
我是一级标题
	

效果：

• 外链式

单独写一个以css为扩展名的文件

然后用link标签链接到html文件中，css文件不能单独运行，必须依赖于html文件

一个html文件可以引入多个css文件

代码：

	
		
		
		
	
	
		
外链式练习
	

h2{
	font-size: 18px;
	color: aqua;
}

效果：

• 行内式

将html代码写在行内标签里

style是每个标签的通用属性

代码：

	
		
		
	
	
		
我是行内样式练习
	

效果：

三：注释

/*这里写注释*/

四：选择器

选择器是指通过一定语法规则选择到对应的HTML标签的css工具

选择器分为四类：基本选择器，复合选择器，伪类选择器和id选择器

代码：

	
		
		
		
	
	
		
我是一个段落标签
		
我是一个三级标题
		
	

效果：

代码：

	
		
		
		
	
	
		
我是一个段落标签1
		
我是一个段落标签2
		
我是一个三级标题
		

			
		
		
	

效果：

五：尺寸样式属性

代码：

效果：

六：文本字体属性

代码：

	
		
		
		
	
	
		
说完了 好象话都说完了
		
总是沉默对坐着
		
眼里是浓浓夜色three
		
感情是偏执的 越爱越是偏执的
		
不相信我看到的
		
硬要说裂缝不过 是皱褶
		
怎么先炽热的却先变冷了
		
my name is Xiaokeai
	

效果：