This is an explanation of the video content.
 用技术延续对ACG的热爱
148

 |   | 

HTML与CSS

定义

Cascading Style Sheets 层叠样式表(CSS)用于格式化网页的布局。 使用CSS,您可以控制颜色、字体、文本大小、元素之间的间距、元素的定位和布局方式、要使用的背景图像或背景颜色、针对不同设备和屏幕大小的不同显示方式等等

使用CSS

CSS可以通过三种方式添加到HTML文档中:

  • 内联 - 通过使用HTML元素内的样式属性

  • 内部 - 通过在<head>部分中使用<style>元素

  • 外部 - 通过使用<link>元素链接到外部CSS文件

添加CSS的最常见方法是将样式保留在外部CSS文件中。但是,在本教程中,我们将使用内联和内部样式,因为这更容易演示,并且更容易让您自己尝试。

内联CSS

内联CSS用于将独特的样式应用于单个HTML元素。

内联CSS使用HTML元素的样式属性。

以下示例将<h1>元素的文本颜色设置为蓝色,<p>元素的文本颜色为红色:

<h1 style="color:blue;">A Blue Heading</h1>

<p style="color:red;">A red paragraph.</p>

外部CSS

外部样式表用于定义许多HTML页面的样式。

要使用外部样式表,请在每个HTML页面的<head>部分中添加链接:

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="styles.css">
</head>
<body>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

外部样式表可以写在任何文本编辑器中。该文件不得包含任何HTML代码,并且必须使用.CSS扩展名保存。

这是”styles.css”文件的代码:

body {
  background-color: powderblue;
}
h1 {
  color: blue;
}
p {
  color: red;
}

CSS控制通用HTML样式

148 🖺前端 ↦ HTML __ 82 字
 HTML #13