新手必读之CSS初级教程 7、综合应用──把所有东西进行综合应用

新手必读之CSS初级教程 内容来自dedecms

7、综合应用──把所有东西进行综合应用

你应该已经在HTML初级教程的综合中创作了一个HTML文档,而且在CSS初级教程的的开始中增加了一行,用以把HTML文档和CSS文档联系起来。

copyright dedecms

  dedecms.com

下面的代码包括了所有我们在初级教程中所学习的方法。只要你把下面的保存起来作为CSS文档,然后在浏览器中查看HTML文档,你就可以理解每一个CSS的属性的表现和怎么应用。最好的方法就是花费时间修改CSS文档和HTML文档上的代码,然后在浏览器中查看到底发生了什么。 copyright dedecms

 Example Source Code [www.52css.com] 织梦好,好织梦

body { 内容来自dedecms

font-family: arial, helvetica, sans-serif;

织梦内容管理系统

font-size: 80%; 内容来自dedecms

color: black;

本文来自织梦

background-color: #ffc; copyright dedecms

margin: 1em; 织梦内容管理系统

padding: 0;

内容来自dedecms

}

内容来自dedecms

/* 顺便说一句,这是注释*/ dedecms.com

p { 织梦内容管理系统

line-height: 1.5em;

内容来自dedecms

} 本文来自织梦

h1 { 本文来自织梦

color: #ffc; dedecms.com

background-color: #900; dedecms.com

font-size: 2em;

织梦好,好织梦

margin: 0;

内容来自dedecms

margin-bottom: 0.5em;

织梦内容管理系统

padding: 0.25em; 内容来自dedecms

font-style: italic;

织梦内容管理系统

text-align: center; 织梦好,好织梦

letter-spacing: 0.5em;

内容来自dedecms

border-bottom-style: solid;

dedecms.com

border-bottom-width: 0.5em;

内容来自dedecms

border-bottom-color: #c00;

织梦内容管理系统

}

copyright dedecms

h2 { copyright dedecms

color: white;

dedecms.com

background-color: #090; 织梦内容管理系统

font-size: 1.5em; 织梦好,好织梦

margin: 0;

dedecms.com

padding: 0.1em; copyright dedecms

padding-left: 1em;

织梦内容管理系统

}

copyright dedecms

h3 {

dedecms.com

color: #999; 本文来自织梦

font-size: 1.25em;

织梦好,好织梦

} copyright dedecms

img { 本文来自织梦

border-style: dashed;

本文来自织梦

border-width: 2px; copyright dedecms

border-color: #ccc; copyright dedecms

}

dedecms.com

a {

织梦好,好织梦

text-decoration: none; 本文来自织梦

} dedecms.com

strong { 织梦内容管理系统

font-style: italic;

内容来自dedecms

text-transform: uppercase; 内容来自dedecms

} 本文来自织梦

li {

本文来自织梦

color: #900; 织梦好,好织梦

font-style: italic;

copyright dedecms

} 织梦好,好织梦

table {

织梦好,好织梦

background-color: #ccc; 本文来自织梦

} copyright dedecms