Html和Css学习笔记-html进阶-div与span

Html和Css学习笔记-html进阶-div与span

此篇博客是我的复习笔记，html和css学的时间太久了，忘得差不多了，最近要使用一下，所以重新打开html的书略读，后记录了标签，元素，属性的具体意义。

这里所介绍的html和css的版本为html5与css3

Html是超文本标记语言（英语全称：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言

Css是层叠样式表(英文全称：Cascading Style Sheets)是一种用来html和xml等文件样式的计算机语言，CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

Html和Css验证工具的地址：http://validator.w3.org/

一.div元素

<div>就相当于一个容器，可以把元素一同放在这个容器里，这个容器也可以成为逻辑区，div可以嵌套使用，并配合使用id属性，例子如下：

<div id="id属性名字">

逻辑区的内容

</div>

书语：在页面中要使用<div>，但不要滥用。如果这样做有助于你将页面分解为逻辑区，从而保证结构清晰并便于指定样式，那么可以增加更多的结构。如果只是为了在页面中创建大量结构而增加<div>，就只会让页面复杂，而没有任何实际好处

二.span元素

<div>元素允许你为块级内容创建逻辑划分，<span>元素则采用类似的方式建立内联内容的逻辑分组，使用方式，举例如下：

<span class="类的名字">xxxx</span>

三.新增css属性

1.width：xxxx;设置元素内容区的宽度

2.float：xxx;定义元素在哪个方向浮动

3.clear:xxxx;定义了元素的哪边上不允许出现浮动元素

4.position:xxxx;属性规定元素的定位类型。

四.css中如何选择子元素

所谓子元素就是元素中的元素，具体指定方法举例如下：

第一种，未使用id元素

父元素名字 子元素名字{

}

第二种 使用id元素

#id属性名字 子元素:
"

五.a元素的css配置方法 

a元素在前面的博文中提到过，是设置链接的，链接不点击是为蓝色有下划线，点击后是红色有下划线，悬停会显示链接内容，那这部分内容的css样式更改方式如下：、

第一种方法

a:link{
这是选择器应用于处于未访问状态的链接
}
a:visited{
这是选择器应用于已访问的链接
}
a:hover{
悬停在一个链接上时会应用这个选择器
}

第二种方法，运用伪类

#类的名字 a:link{
这是选择器应用于处于未访问状态的链接
}
#类的名字 a:visited{
这是选择器应用于已访问的链接
}
#类的名字 a:hover{
悬停在一个链接上时会应用这个选择器
}

原文地址https://www.cnblogs.com/renren-study-notes/p/10483148.html