使用 CSS 样式表
改变这个：
<link rel="stylesheet" href="">
对此：
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
要使用样式表，您必须向要设置样式的 HTML 元素添加一个类：
<div class="w3-container w3-black">
<h1>这是一个标题</h1>
<p>这是一个段落。</p>
<p>这是另一段。</p>
</div>
HTML / CSS 骨架
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>页面标题</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<style>
</style>
<script src=""></script>
<body>
<img src="img_la.jpg" alt="洛杉矶" style="width:100%">
<div class="w3-container w3-black">
<h1>这是一个标题</h1>
<p>这是一个段落。</p>
<p>这是另一段。</p>
</div>
</body>
</html>
单击“自己尝试”按钮来查看其工作原理！
尝试将容器的背景颜色从青色更改为黑色。
你做了吗？
恭喜！
您刚刚学习了使用样式表的基础知识。
继续阅读！
如何积极响应
HTML 代码
<div class="w3-row">
<div class="w3-third">
<img src="img_avatar.png" alt="名称1" style="width:100%">
</div>
<div class="w3-third">
<img src="img_avatar.png" alt="名称2" style="width:100%">
</div>
<div class="w3-third">
<img src="img_avatar.png" alt="名称3" style="width:100%">
</div>
</div>
亲自尝试 »
如何创建卡片
准备好迎接一些真正先进的事物了吗？
HTML 格式的名片怎么样？
包括图像和文字。
玩弄下面的代码一会儿，直到你认为你已经掌握它。
之后，我们将开始编写真正精彩的 HTML 页面。
约翰·多伊
工程师
HTML 代码
<div class="w3-card" style="width:200px">
<img src="img_avatar.png" style="width:100%">
<div class="w3-container w3-center">
<p class="w3-xlarge">约翰·多伊</p>
<p>工程师</p>
</div>
</div>
亲自尝试 »
