1 / 6
文档名称:

黑马程序员web前端教程03-CSS进阶笔记.doc

格式:doc   大小:184KB   页数:6页
下载后只包含 1 个 DOC 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

黑马程序员web前端教程03-CSS进阶笔记.doc

上传人:miaoshen1985 2022/3/5 文件大小:184 KB

下载得到文件列表

黑马程序员web前端教程03-CSS进阶笔记.doc

文档介绍

文档介绍:目录
目录 2
3
CSS盒模型
网页中所有的元素都是矩形的,所以可以看出一个个盒子。
网页由多个盒子组成。
盒子:边框+内边距+内容区域+外边距组成。
IE6的盒模型的bug:
目录
目录 2
3
CSS盒模型
网页中所有的元素都是矩形的,所以可以看出一个个盒子。
网页由多个盒子组成。
盒子:边框+内边距+内容区域+外边距组成。
IE6的盒模型的bug:背景色不能穿透 边框。
而且如果不设置争取的doctype的话,ie6显示的盒子也不是标准的盒子。
边框
边框可以被背景色穿透,边框包括三部分可以进行设置:边框的宽度、边框的颜色、边框的样式。
可以分别分开设置,也可以进行合写进行统一设置。所有的边框相关设置在如下的代码中:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>02CSS设置盒子边框</title>
<style>
.box {
height: 200px;
width: 200px;
background-color: green;
/*设置上边框的宽度*/
border-top-width: 20px;
/*设置上边框的颜色*/
border-top-color: red;
/*设置上边框的样式: 虚线、实线、点线..*/
border-top-style: double;
border-bottom-color: yellowgreen;
border-bottom-width: 5px;
bor