CSS
释义CSS(Cascading Style Sheets)，即层叠样式表，与HTML超文本标记语言配合以定义网页表现的样式语言。 历史 当初一帮技术人员想出HTML，主要侧重于定义内容，比如 表示一个段落， 表示标题，而并没有过多设计HTML的排版和界面效果。 随着Internet的迅猛发展，HTML被广泛应用，上网的人们当然希望网页做得漂亮些，因此HTML排版和界面效果的局限性日益暴露出来。为了解决这个问题，人们也走了不少弯路，用了一些不好的方法，比如给HTML增加很多的属性结果将代码变得很臃肿，将文本变成图片，过多利用Table来排版，用空白的图片表示白色的空间等。直到CSS出现。 CSS可算是网页设计的一个突破，它解决了网页界面排版的难题。可以这么说，HTML的Tag主要是定义网页的内容(Content)，而CSS决定这些网页内容如何显示(Layout)。 CSS与网页的链接方法 内嵌样式(Inline Style) 内部样式表(Internal Style Sheet) 外部样式表(External Style Sheet) 内嵌样式(Inline Style) Inline Style是写在Tag里面的。内嵌样式只对所在的Tag有效。 这个Style定义 里面的文字是20pt字体，字体颜色是红色。 显示示例 内部样式表(Internal Style Sheet) 内部样式表是写在HTML的里面的。内部样式表只对所在的网页有效。 这个标题使用了Style。 这个标题没有使用Style。 显示示例 内部样式表(Internal Sytle Sheet)要用到Style这个Tag，写法如下： 外部样式表(External Style Sheet) 如果很多网页需要用到同样的样式(Styles)，用什么方法呢？ 将样式(Styles)写在一个以.css为后缀的CSS文件里，然后在每个需要用到这些样式(Styles)的网页里引用这个CSS文件。 比如可以用文本编辑器(NotePad)建立一个叫home的文件，文件后缀不要用.txt，改成.css。文件内容如下： H1.mylayout {border-width: 1; border: solid; text-align: center;color:red} 然后你建立一个网页，代码如下： 这个标题使用了Style。 这个标题没有使用Style。 显示示例 使用外部(Extenal)样式表，相对于内嵌(Inline)和内部式(Internal)的，有以下优点： 样式代码可以复用。一个外部CSS文件，可以被很多网页共用。 便于修改。如果要修改样式，只需要修改CSS文件，而不需要修改每个网页。 提高网页显示的速度。如果样式写在网页里，会降低网页显示的速度，如果网页引用一个CSS文件，这个CSS文件多半已经在缓存区(其它网页早已经引用过它)，网页显示的速度就比较快。 解决css文件过大的问题 如果页面内容过多，css文件会很大，同样会造成很多不便，那么我们该如何解决这个问题呢？我们可以对每个细节进行css设计，比如对于字体的设置我们可以存入font.css文件，对边界等的设定我们可以存入lay.css文件，对其他一些版式的规定可以存入other.css文件，然后我们建立一个main.css文件，然后在里边写入如下代码： @import url(font.css); @import url(lay.css); @import url(other.css); 然后只需要在html文件里添上main.css的链接即可，这样子一方面减小了css文件的容量，另一方面似乎也更方便管理，特别是对大型网站。 串联(Cascading) CSS第一个字母，是Cascading，意为串联。它是指不同来源的样式(Styles)可以合在一起，形成一种样式。 Cascading的顺序是： 浏览器缺省(browser default)(优先级最低) 外部样式表(Extenal Style Sheet) 内部样式表(Internal Style Sheet) 内嵌样式表(Inline Style)(优先级最高) 样式(Styles)的优先级依次是内嵌(inline), 内部(internal), 外部(external), 浏览器缺省(browser default)。假设内嵌(Inline)样式中有font-size:30pt, 而内部(Internal)样式中有font-size:12pt，那么内嵌(Inline)式样式就会覆盖内部(Internal)样式。
本文来自网络转载，仅供学习参考！不代表趣典故立场，本站不拥有所有权，不承担相关法律责任。如发现本站有抄袭侵权/违规的内容，请发送邮件至@qq.com进行反馈，一经查实，本站将立刻删除。
