CSS 注释 详解
css3基础 2022-05-23 12:01:24小码哥的IT人生shichen
CSS 注释
CSS 注释
注释用于解释代码，以后在您编辑源代码时可能会有所帮助。
浏览器会忽略注释。
位于 <style> 元素内的 CSS 注释，以 /* 开始，以 */ 结束：
示例代码：
/* 这是一条单行注释 */
p {
color: red;
}
完整实例【亲自试一试】：
<!DOCTYPE html>
<html>
<head>
<style>
/* 这是单行注释 */
p {
color: red;
}
</style>
</head>
<body>
<p>Hello World!</p>
<p>这段文本由 CSS 设置样式。</p>
<p>CSS 注释不会在输出中显示。</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
您可以在代码中的任何位置添加注释：
示例代码：
p {
color: red; /* 把文本设置为红色 */
}
完整实例【亲自试一试】：
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red; /* 把颜色设置为红色 */
}
</style>
</head>
<body>
<p>Hello World!</p>
<p>这段文本由 CSS 设置样式。</p>
<p>CSS 注释不会在输出中显示。</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
注释能横跨多行：
示例代码：
/* 这是
一条多行的
注释 */
p {
color: red;
}
完整实例【亲自试一试】：
<!DOCTYPE html>
<html>
<head>
<style>
/* 这是
多行的
注释 */
p {
color: red;
}
</style>
</head>
<body>
<p>Hello World!</p>
<p>这段文本由 CSS 设置样式。</p>
<p>CSS 注释不会在输出中显示。</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
HTML 和 CSS 注释
从 HTML 教程中，您学习到可以使用 <!--...--> 语法在 HTML 源代码中添加注释。
在下面的例子中，我们结合使用了 HTML 和 CSS 注释：
示例代码：
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red; /* 将文字颜色设置为红色 */
}
</style>
</head>
<body>
<h2>My Heading</h2>
<!-- 这些段落将是红色的 -->
<p>Hello World!</p>
<p>这段文本由 CSS 设置样式。</p>
<p>CSS 注释不会在输出中显示。</p>
</body>
</html>
完整实例【亲自试一试】：
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red; /* 把文本色设置为红色 */
}
</style>
</head>
<body>
<h1>我的标题</h1>
<!-- 这些段落将是红色 -->
<p>Hello World!</p>
<p>这段文本由 CSS 设置样式。</p>
<p>CSS 注释不会在输出中显示。</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
