day06_HTML和CSS

HTML的介绍:

HTML是超文本标记语言

HTML文档的后缀名可以是.html或者.htm

HTML中标记（或标签）都是有开始和结束

HTML中标记也有单标记（

---

）

常用标记:

2.与文本相关的标记

其他的标记


3.段落标记  

5.列表标记:

05_常用标记(图片超链接).html

 

9.框架标记：

对浏览器的窗口进行分割

rows/cols:这两个属性可以定义如何来分割窗口

10.div和span：

div：独占一行的标记，称之为块级元素

span : 能够与其他标记同排在一行的标记，称之为行内元素

CSS：层叠样式表 将HTML结构代码与样式代码进行分离，便于维护

CSS的使用方式：

1.在HTML文档中每一个标记都有一个属性style,在该属性中写css代码，即可引入css样式

2.在HTML中有一个标记，在标记中写css代码即可，但是标记一定要写在head标记中

3.新建一个css文件，在css文件中写css代码，通过标记将css文件引入到HTML文档中，link标记必须要写在head标记中

优先级：style属性>style标记>link引入样式 就近原则：谁离标记最近，就选择最近样式

CSS语法结构：

常用的选择器：

1.标签（元素）选择器

通过HTML中标记名称或选择设置样式的标记

div{color:red; font-size:20px;}

span{color:red;}

2.id选择器：

在HTML每一个标记中都一个属性ID，通过属性ID的值来选择设置样式的标记

查找ID值为myDiv的标记设置样式

#myDiv{ color:green; border:1px solid red;}

查找span标记中ID值为myDiv的标记设置样式

span#myDiv{ color:green; border:1px solid red;}

3.类（class）选择器 ：

在HTML中每一个标记都有一个属性class，通过class属性值选择标记设置样式

查找HTML中所有标记class属性值为mydiv的标记设置样式

.mydiv{ color:red; background:#000; }

查找所有的div中class属性值为mydiv的标记设置样

div.mydiv{ color:red; background:#000; }

4.伪类选择器