级联样式表的好处

级联样式表有很多好处。它们允许您在整个网站上使用相同的样式表。有两种方法可以做到这一点：...

级联样式表有很多好处。它们允许您在整个网站上使用相同的样式表。有两种方法可以做到这一点：

  • 链接到LINK元素
<link rel="stylesheet" href="styles.css">
  • 使用@import命令导入
<style>@import url('http://www.yoursite.com/styles.css');</style>

外部样式表的优缺点

级联样式表的一个优点是，您可以使用它们来保持站点的一致性。最简单的方法是链接或导入外部样式表。如果对站点的每个页面使用相同的外部样式表，则可以确保所有页面都具有相同的样式。

使用外部样式表的一些优点包括可以同时控制多个文档的外观。如果您与一组人员一起创建网站，这一点尤其有用。许多样式规则可能很难记住，虽然您可能有一份打印的样式指南，但必须不断翻阅它以确定示例文本是用12点Arial字体还是14点Courier字体编写是一件乏味的事情。

您可以创建样式类，然后在许多不同的HTML元素上使用。如果您经常使用特殊的Wingdings字体来强调页面上的各种内容，则可以使用在样式表中设置的Wingdings类来创建它们，而不是为每个强调实例定义特定的样式。

您可以轻松地将样式分组以提高效率。CSS可用的所有分组方法都可以在外部样式表中使用，这为您的页面提供了更多的控制和灵活性。

也就是说，也有很好的理由不使用外部样式表。首先，如果你链接到很多，他们可以增加下载时间。

每次创建新的CSS文件并将其链接或导入文档时，都需要Web浏览器再次调用Web服务器以获取该文件。服务器调用会降低页面加载时间。

如果您只有少量样式，它们会增加页面的复杂性。因为样式在HTML中是不可见的，所以任何查看页面的人都必须获得另一个文档（CSS文件）来了解发生了什么。

如何创建外部样式表

外部样式表的编写方式与嵌入和内联样式表相同。但是您只需要编写样式选择器和声明。文档中不需要样式元素或属性。

与所有其他CSS一样，规则的语法为：

selector { property : value; }

这些规则将写入扩展名为的文本文件

.css. For example, you might name your style sheet styles.css

链接css文档

为了链接样式表，可以使用link元素。这具有属性rel和href。rel属性告诉浏览器您正在链接什么（在本例中是样式表），href属性保存CSS文件的路径。

还有一个可选的属性类型，可用于定义链接文档的MIME类型。这在HTML5中不是必需的，但应该在HTML4文档中使用。

下面是用于链接名为styles.CSS的CSS样式表的代码：

<link rel="stylesheet" href="styles.css">

在HTML 4文档中，您可以编写：

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

导入css样式表

导入的样式表放置在样式元素中。如果愿意，也可以使用嵌入样式。还可以在链接样式表中包含导入的样式。在样式或CSS文档中，写下：

@import url('http://www.yoursite.com/styles.css');

  • 发表于 2021-09-08 11:12
  • 阅读 ( 80 )
  • 分类：数学

你可能感兴趣的文章

mysql数据库模式编写入门指南

...据库（如mySQL）的最大优点之一是它非常支持外键约束和级联。这是指通过列将两个表链接在一起，形成父子关系，因此删除父行时，也会自动删除必要的子行。 ...

  • 发布于 2021-03-26 19:24
  • 阅读 ( 232 )

使用css格式化文档以便打印

...能对结果印象不太深刻。因此，您可能不知道打印文档的样式可以与屏幕上使用层叠样式表（CSS）的样式大致相同。 ...

  • 发布于 2021-03-28 16:05
  • 阅读 ( 246 )

如何在excel中用透视表计算百分比变化

...已命名为“Sales” 如果需要，也可以在此处更改表格的样式。 创建数据透视表以显示百分比更改 现在让我们继续创建数据透视表。在新表中，单击“**”&gt;“数据透视表”。 将出现“创建数据透视表”窗口。它将自动检测到...

  • 发布于 2021-04-03 16:01
  • 阅读 ( 195 )

如何在word中为表格添加边框或更改边框

... 如果已删除表中的全部或部分边框，或者要更改边框的样式或厚度，请将光标放置在表中的任何单元格中。表格控制柄显示在表格的左上角。单击表句柄以选择整个表。如果只想将边框应用于表格的特定部分，请将光标放在该...

  • 发布于 2021-04-10 06:47
  • 阅读 ( 133 )

如何用microsoftword像pro一样创建索引表

...件创建索引表的全部内容。让我们仔细看看如何定制索引样式。 在索引中创建交叉引用 Word允许我们创建不同类型的索引。这里我们有一个带有子条目的索引，当我们想在文档中对一组密切相关的概念进行分组时，它特别有用。...

  • 发布于 2021-04-13 04:26
  • 阅读 ( 169 )

独自创立(bootstrap)和css格式(css)的区别

...根据自己的选择进行更改。 什么是css格式(css)？ CSS代表级联样式表。它很容易学习，可以与HTML或XHTML结合使用。它是一种简单的设计语言，有助于使网页更美观。 CSS有多种版本。CSS1是在1996年引入的，它是所有HTML标记的一个简...

  • 发布于 2021-06-30 22:21
  • 阅读 ( 209 )

css工具箱是网页设计师的杀手文本编辑器

...过自动完成、语法突出显示和几个更高级的功能，简化了级联样式表（CSS）的工作，使其从常规文本编辑器中脱颖而出。对于那些不知道的人来说，CSS文件是网页样式的构建块。CSS工具箱提供了构建样式表的高级功能，包括CSS美...

  • 发布于 2021-07-29 22:02
  • 阅读 ( 161 )

如何使用css设置xml文档的样式(style xml documents with css)

...没有格式。 如何查看xml 在浏览器中查看XML的关键是级联样式表。样式表允许您定义XML文档的各个方面，从文本的大小和颜色到非文本对象的背景和位置。 假设您有一个XML文档： ]&gt; Judy Layard Jennifer Brendan 如果要...

  • 发布于 2021-09-04 21:06
  • 阅读 ( 173 )

使用html表元素属性

...CSS padding属性。 -在表格上使用CSS属性边框间距。 -使用CSS样式边框颜色：黑色；和桌子上的边框样式。 -使用CSS样式边框颜色：黑色；并在表格的相应元素上添加边框样式。 -相反，您应该在标题中描述表的结构，或者将整个表...

  • 发布于 2021-09-04 21:31
  • 阅读 ( 160 )

@进口(@import)和css的链接？(link for css?)的区别

...用@import方法或链接到CSS文件，以不同的方式包含其外部级联样式表。@import和linkforcss的区别是什么？您如何决定哪一个更适合您？ @进口(@import)和链接(link)的区别 链接是在网页上包含外部样式表的第一种方法。它旨在将页面...

  • 发布于 2021-09-05 00:08
  • 阅读 ( 160 )
xmgiclqdm
xmgiclqdm

0 篇文章

相关推荐