标签：
CSS(Cascading Stytle Sheets)层叠样式表，用来定义网页的显示效果。可以解决HTNL代码对样式定义的重复，提高了后期样式代码的可维护性，并增强了网页的显示效果。即CSS将网页内容和显示样式分离，提高了显示功能。
利用标签中style属性来改变每个标签的显示样式。
<body> <div style="background-color: #76EE00;">这是div区域1</div> <div>这是div区域2</div> <span style="background-color: #76EE00;">这是span区域1</span> <span>这是span区域2</span> <p style="background-color: #76EE00;">这是p的区域1</p> <p>这是p的区域2</p> </body>
结果:
该方式比较灵活，但是对于多个相同标签的同一样式定义比较麻烦，适合局部修改。
在head标签中加入style标签，对多个标签进行统一修改。
<html> <head> <title>HTML学习</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <style type="text/css"> div { background-color: #76EE00; } p{ background-color: #CD00CD; } </style> </head> <body> <div>这是div区域1</div> <div>这是div区域2</div> <span>这是span区域1</span> <span>这是span区域2</span> <p>这是p的区域1</p> <p>这是p的区域2</p> </body> </html>
结果:
该方式可以对单个页面的样式进行统一设置，但对于局部不够灵活。
前提是已经存在一个定义好的CSS文件。网页的一部分样式需要用到，那么就用到这种方式。
<html> <head> <title>HTML学习</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <style type="text/css"> @import url("css/mycss.css"); p{ background-color: #76EE00; } </style> </head> <body> <div>这是div区域1</div> <div>这是div区域2</div> <span>这是span区域1</span> <span>这是span区域2</span> <p>这是p的区域1</p> <p>这是p的区域2</p> </body> </html>
div { background-color: #CD00CD; }
结果:
url括号后面必须要用分号结束。如果导入进来的样式与本页面定义的样式重复，以本页定义样式为准。
标签：
原文地址：http://www.cnblogs.com/yangang2013/p/5409293.html
