网页设计中CSS关联调用的4种方式

哥哥来弄妹妹

哥哥来弄妹妹

2016-02-19 19:43

今天图老师小编要向大家分享个网页设计中CSS关联调用的4种方式教程,过程简单易学,相信聪明的你一定能轻松get!

  首先介绍一下HTML文档与CSS 的关联常见有4种方式:

  1、使用link标记

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

  2、使用style元素

  <style type="text/css">

  body{background:#fff;}

  h1{font-size:12px;}

  </style>

  3、使用@import指令

  <style type="text/css">

  @import url(sheet1.css);

  @import "sheet2.css";

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

  </style>

  4、使用style属性的内联样式(inline style)

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

  <p style="color:#f00;">这是红色的字</p>

  在实际应用中,使用style属性的内联样式是不推荐使用的,XHTML1.1已经将其标准为不建议使用,原因很简单这种方式不比font标记强多少,削弱了CSS集中控制整个文档外观的优点。

  前3种方式利用了link标记和style标记,在IE(包括IE6、IE7和IE8 beta1)中有如下限制:

  ◆ 文档中只有前31个link或style标记关联的CSS能够应用。

  从第32个开始,其标记关联的CSS都将失效。IE的官方文档All style tags after the first 30 style tags on an HTML page are not applied in Internet Explorer也提及这个限制,包括在使用.xsl的.xml文件也有这个限制。但是似乎写错了数量。请在IE看:

  ◆ 一个style标记只有前31次@import指令有效应用。

  从第32个@import指令开始忽略。

  ◆ 一个css文件只有前31次@import指令有效应用。

  从第31个@import指令开始忽略。

  ◆ 一个CSS文件的不能超过288kb?

  IE对CSS的限制在绝大部分情况下是不会遇到的,即使遇到最佳的解决方案也应该是手动或者通过后端程序对CSS文件和响应的标记进行合并,最小化的http请求数是优化页面呈现的第一原则。

展开更多 50%)
分享

猜你喜欢

网页设计中CSS关联调用的4种方式

Web开发
网页设计中CSS关联调用的4种方式

优化CSS在网页中的加载方式

Web开发
优化CSS在网页中的加载方式

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

探讨:网页外部引用CSS的两种方式

Web开发
探讨:网页外部引用CSS的两种方式

CSS网页设计中的解决方案

Web开发
CSS网页设计中的解决方案

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

CSS技术在网页设计中的运用

Html CSS布局 Div+CSS XHTML
CSS技术在网页设计中的运用

网页设计中谨慎使用CSS sprites

Web开发
网页设计中谨慎使用CSS sprites

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

CSS实战:美化段落文本之首字下沉

CSS实战:美化段落文本之首字下沉

微软未来的“灵魂”——SQL Server 2005探密

微软未来的“灵魂”——SQL Server 2005探密
下拉加载更多内容 ↓