[置顶] CSS+DIV总结

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

HTML在Web飞速发展的过程中起着重要作用，有着重要地位。HTML初衷是为了表达标签（<p>、<table>）的内容信息。同时文档布局由浏览器来完成，不使用任何格式的标签。慢慢地IE不断将新的HTML标签和属性添加到HTML规范中，创建文档内容清晰地独立于文档表现层的站点越来越困难。所以为了解决这个问题，创造出了HTML之外的样式即CSS层叠样式表。

学习了一周CSS+DIV，总结如下：

本视频主要讲的是用CSS+DIV进行网页布局。前半部分是一些基础的css样式，后面的是一些例子，根据例子来理解CSS+DIV的布局。把每一块都写成div，然后用CSS控制其样式进行美化布局效果，着重实际操作。

本视频主要包括CSS的基本语法与概念：设置文字、图片、背景、表格和菜单等网页元素的方法，以及CSS滤镜的使用。还有一些扩展知识：CSS与JavaScript、CSS与XML、CSS与Ajax的综合应用。后面还有几个大例子，通过大例子深刻理解了CSS+DIV布局。把一块内容放在一个DIV中，然后对其标签的id,class的样式在CSS中进行设置。保持了HTML代码和CSS代码的分离。

那么HTML中引入CSS的三种方式如下：

1、行内样式

在行内直接写样式，很简单的对某个元素单独定义样式。

2、内嵌式

<head> <title>页面标题</title> <style type="text/css">  </style> </head>

有些低版本的浏览器不能识别style标记，这意味着低版本的浏览器会忽略style标记里的内容，并把style标记里的内容以文本直接显示到页面上。为了避免这样的情况发生，我们用加HTML注释的方式（）隐藏内容而不让它显示。

3、链入外部样式表

<link href="1.css" type="text/css" rel="stylesheet">

4、导入内部样式

<head> <style type="text/css">  </style> </head>

导入外部样式表存在于内部样式表中。必须在样式表开始部分，在其他内部样式表上面。

总结：学习CSS+DIV重在理解和操作。还需要多练习。不论哪门语言都有其优缺点。

Div+CSS的优点：

1、减少页面的加载时间

页面体积变小，浏览速度变快。

2、易于修改

HTML页面和CSS代码是分开的，将网页的内容和表现形式分离。修改设计时只需要改一下样式即可，不会打破页面中其他样式的布局，这种特点是table不具备的。