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

2016-02-19 19:43 22 1 收藏

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

【 tulaoshi.com - Web开发 】

  首先介绍一下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";

  </style>

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

  <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指令有效应用。

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

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

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

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

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

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

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

来源:http://www.tulaoshi.com/n/20160219/1621640.html

延伸阅读
数月来学习web标准,并遵循标准设计和制作web页面。一直想写点什么,整理一下自己的心得体会。写这篇文章,主要是针对中文排版设计,英文排版因为很少做,所以不涉及。 先介绍如何设定字体、颜色、大小、段落空白等比较简单的应用,后面再介绍下比如首字下沉、首行缩进。最后讲一些常用的web页面中文排版,比如中文字的截断、固定宽度词内折...
标签: Web开发
xhtml+css页面制作过程中问题的解决方案,说是解决方案应该有点过了,充其量只不过是给刚刚开始学标准页面制作的朋友们的一些小建议,如果讲得不对的地方请多多包涵,当然也可以提出你们更好的方法,大家相互学习交流,共同成长! 无论是谁,在制作页面的过程都是会碰到这样或者那样的问题,出了问题就肯定要解决。解决问题的前提是要知道...
前言   很多网友问到,在HTML的页面中放置一个COM对象,这个对象该如何调用页面中的脚本函数的问题,本人近日也因为工作需要实现这样的功能,在网上搜索后,获得了很多帮助,但并没有发现完整的实现。本文描述了实现过程中的几个要点,同时提供一个示例工程的下载。   1——   给接口添加一个方法:   方法名:SetClie...
标签: Web开发
多层模式表单(Cascading Style Sheet, CSS)是一种为超文本置标语言(HyperText Markup Language, HTML)提供增强补充服务的技术,可对每一个HTML的置标(tag)做精雕细刻的修饰。只用HTML制作的网页,对页面内各部分的修饰能力有限且语句烦锁,CSS正是弥补这一缺陷的有力技术,它语句、文法简单,只要在源码中插入STYLE语句就可轻易实现页面...
标签: Web开发
我们都知道,表单是网页的重要组成部分,它是网站与用户进行交互的窗口。然而表单中固定的诸如说明文字、输入框、提交按钮等元素,使得表单设计略显乏味,难有创新,这一点不少Web设计师深有体会。好的Web设计师就是可以在平凡处挖亮点,让表单设计或耳目一新,或整洁素雅。下面就来看这样的15个基于CSS的优秀表单设计。 以下译自: 中文原...

经验教程

145

收藏

61
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部