div与css结合的四种方式
浏览数：24 /
时间：2015年06月09日
第一种方式：
<div style=" background-color:#00ff00;font-size: 20px"> 第一种方式</div >
缺点：这种方式暴露的缺点是 代码严重重复。
第二种方式：
<div style=" background-color:#00ff00;font-size: 20px"> 第一种方式</div >
缺点：这种方式暴露的缺点是 代码严重重复。
第二种方式：
格式：标签名｛
属性一：属性值；
属性二：属性值；
...
｝
例子：第一步：<style type= "text/css">
第三种方式：
将 css的代码专门抽取到一个 单独 css文件中去，然后在 html页面中去引入显示样式文件 就可以了， 这样可以实现代码的复用
例子：第一步：Text03.css
属性一：属性值；
属性二：属性值；
...
｝
例子：第一步：<style type= "text/css">
div{
background-color:#00ff00;
font-size:20px;
}
</style>
第二步：<div> 第二种方式</div >
缺点： 这种方式中修饰的时候 只适用于单独的某个页面。 那么如果出现多个页面 有相同的 标签，并且实现同样的显示样式的时候，那么 这种方式书写的 css代码又会出现严重的重复。
第三种方式：
将 css的代码专门抽取到一个 单独 css文件中去，然后在 html页面中去引入显示样式文件 就可以了， 这样可以实现代码的复用
例子：第一步：Text03.css
#div03{
background-color:#00ff00;
font-size:20px;
}
第二步：<style type= "text/css">
第四种方式:
上面第三种方式 通常 看上去不美观, 所以 就出现第四中方式, 使用一个 link标签引入进来. 使用link引入标签引入css代码是开发中最常用的.
例子：第一步：同上
@import url(css/Text03.css);
</style>
第三步：<div id= "div03"> 第三种方式</div >
第四种方式:
上面第三种方式 通常 看上去不美观, 所以 就出现第四中方式, 使用一个 link标签引入进来. 使用link引入标签引入css代码是开发中最常用的.
例子：第一步：同上
第二步：<link href= "css/Text03.css" rel= "stylesheet" type= "text/css">
第三＝步：同上
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
