Los comentarios CSS no se muestran en el navegador, pero pueden ayude a documentar su código fuente.
Los comentarios se utilizan para explicar el código y pueden ayudar cuando edite el código fuente en una fecha posterior.
Los navegadores ignoran los comentarios.
Un comentario CSS se coloca dentro del elemento <style> y comienza con /* y termina con */:
/* This is a single-line comment */
p
{
color: red;
}Pruébelo usted mismo →
<!DOCTYPE html>
<html>
<head>
<style>
/* This is a single-line comment */
p {
color: red;
}
</style>
</head>
<body>
<p>Hello World!</p>
<p>This paragraph is styled with CSS.</p>
<p>CSS comments are not shown in the output.</p>
</body>
</html>
Puedes agregar comentarios donde quieras en el código:
p
{
color: red;
/* Set text color to red */
}Pruébelo usted mismo →
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red; /* Set text color to red */
}
</style>
</head>
<body>
<p>Hello World!</p>
<p>This paragraph is styled with CSS.</p>
<p>CSS comments are not shown in the output.</p>
</body>
</html>
Los comentarios también pueden abarcar varias líneas:
/* This is
a multi-line
comment */
p
{
color: red;
}Pruébelo usted mismo →
<!DOCTYPE html>
<html>
<head>
<style>
/* This is
a multi-line
comment */
p {
color: red;
}
</style>
</head>
<body>
<p>Hello World!</p>
<p>This paragraph is styled with CSS.</p>
<p>CSS comments are not shown in the output.</p>
</body>
</html>
En el tutorial de HTML, aprendió que puede agregar comentarios a su fuente HTML usando el sintaxis.
En el siguiente ejemplo, utilizamos una combinación de comentarios HTML y CSS:
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red; /* Set
text color to red */
}
</style>
</head>
<body>
<h2>My
Heading</h2>
<!-- These paragraphs will be red -->
<p>Hello
World!</p>
<p>This paragraph is styled with CSS.</p>
<p>CSS comments are
not shown in the output.</p>
</body>
</html>Pruébelo usted mismo →
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red; /* Set text color to red */
}
</style>
</head>
<body>
<h2>My Heading</h2>
<!-- These paragraphs will be red -->
<p>Hello World!</p>
<p>This paragraph is styled with CSS.</p>
<p>HTML and CSS comments are not shown in the output.</p>
</body>
</html>