如何用html和css制作网页（前端新手看过来）

发布时间：2024-08-26阅读(12)

导读层叠样式表（CascadingStyleSheet，简称：CSS）是为网页添加样式的代码。本节将介绍CSS的基础知识，并解答类似问题：怎样将文本设置为黑色或....

层叠样式表（Cascading Style Sheet，简称：CSS）是为网页添加样式的代码。本节将介绍 CSS 的基础知识，并解答类似问题：怎样将文本设置为黑色或红色？怎样将内容显示在屏幕的特定位置？怎样用背景图片或颜色来装饰网页？

CSS 究竟什么来头？

和 HTML 类似，CSS 也不是真正的编程语言，甚至不是标记语言。它是一门样式表语言，这也就是说人们可以用它来选择性地为 HTML 元素添加样式。举例来说，要选择一个 HTML 页面里所有的段落元素，然后将其中的文本改成红色，可以这样写 CSS：

p { color: red;}

不妨试一下：首先新建一个 styles 文件夹，在其中新建一个 style.css 文件，将这三行 CSS 保存在这个新文件中。

然后再将该 CSS 文件连接至 HTML 文档，否则 CSS 代码不会对 HTML 文档在浏览器里的显示效果有任何影响。（如果你没有完成前几节的实践，请复习处理文件和 HTML 基础。在笔记本里有这个方面的内容！）

1、打开 index.html 文件，然后将下面一行粘贴到文档头（也就是 <head> 和 </head> 标签之间）。

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

2、保存 index.html 并用浏览器将其打开。应该看到以下页面：

如果段落文字变红，那么祝贺你，你已经成功地迈出了 CSS 学习的第一步。

“CSS 规则集”详解

让我们来仔细看一看上述CSS：

整个结构称为 规则集（通常简称“规则”），各部分释义如下：

注意其他重要的语法：

如果要同时修改多个属性，只需要将它们用分号隔开，就像这样：

p { color: red; width: 500px; border: 1px solid black;}

多元素选择

也可以选择多种类型的元素并为它们添加一组相同的样式。将不同的选择器用逗号分开。例如：

p, li, h1 { color: red;}

不同类型的选择器

选择器有许多不同的类型。上面只介绍了元素选择器，用来选择 HTML 文档中给定的元素。但是选择的操作可以更加具体。下面是一些常用的选择器类型：

TAGS标签：何用 html 制作网页前端如何用html和cs

欢迎分享转载→http://www.youqulife.com/read-385082.html