现在学html4,HTML学习心得(4)

HTML学习心得(4)

CSS的简单框架结构和元素渲染

什么是CSS

CSS，中文名：层叠样式表。是一种用来表现HTML等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。

我们可以简单的来理解它的作用，它作为一个可以设定部件风格，色彩，样式，以及调配各部件之间的关系等等一系列的操作，怎么说呢，它能起到的作用比我们想象的要强大。我们可以通过它实现一张网页的大部分美化，也可以使用它使我们的网页不单单局限于一个二维的平面。

CSS编译环境

和HTMl类似的，CSS也可以使用记事本编写，完成后只需要将格式改为.css文件即可。

正常的电脑

支持css的浏览器

记事本

也可使用Sublime text 打开编写

CSS的内链外链

内链

CSS链接到网页上的方式有两种，现在我们先来说一下简单的内链方式。

标签内属性

标签内部的属性设置在我看来也是属于CSS的范畴之内的，所以我把这部分放在这里，做一个总结。

在每个标签里面，我们会发现存在一个style的关键字，通常我们是这样使用它的：

即在标签的其实标签里加入style关键字，然后接=和“ ”，在引号中加入我们想要的属性内容，譬如更改颜色，更改大小，规定元素的位置，设置优先显示级别等等操作。

这样的在标签内部加入的属性设置，我把它归为CSS内链的标签内属性这一类。但很明显的，我们会发现这样有一个问题：虽然这样写可以非常方便看到这个标签携带的属性，但我们在后面使用的时候会发现，抛开文件的长度大大增加这一点不说，我们在后期修改或者维护的时候会变得很麻烦。大量的属性代码占据的大部分的代码页面，会使我们找到目标标签变得麻烦[^18]，所以我们想要一种能将属性设置集中的方法，来简便我们的查找和后期调试。

所以，在

内的全局属性定义就出现了。

在这里，我们会讲到

中

在这段截取的源码中，我们可以看到，在

中我们定义了一个

因为.css文件和HTML文件在一个文件夹下，我们可以省略href要求的文件的全部路径，只需要写出.css文件的名字就可以了，不要忘记加文件的后缀。然后再下面使用

CSS的ID命名

在了解到了CSS的外链和

内的全局属性定义后，我们不免会有这样一个问题：”怎么让浏览器知道我的属性设置是给谁都写的呢？一张网页里有这么多的标签。”我们在这里使用使用id和class来结局这个问题，下面我们来介绍CSS中的ID命名。

在基本上每个标签中，都有这样一个属性，它不包含在

命名的格式很简单，在这里就不多叙述了。要注意一个标签只能有一个ID 。那么我们再来看看在CSS文件中是怎么规定ID的。