Diferencias entre Class y ID - Ejemplo de uso en HTML y CSS

Un elemento HTML sólo puede tener un ID que pertenezca a ese único elemento, mientras que varios elementos pueden usar un nombre de clase.

Diferencias entre Class y ID - Ejemplo de uso en HTML y CSS | Aprender HTML | Un elemento HTML sólo puede tener un ID que pertenezca a ese único elemento, mientras que varios elementos pueden usar un nombre de clase
COMPÁRTELO:

Puedes definir sus propios selectores en forma de selectores de clase e ID.

El beneficio de esto es que puede tener el mismo elemento HTML, pero presentarlo de manera diferente según su clase o ID.

En el CSS, un selector de clase es un nombre precedido por un punto (".") Y un selector de ID es un nombre precedido por un carácter hash ("#").

Entonces, el CSS podría verse algo así como:


#top {
    background-color: #ccc;
    padding: 20px
}

.intro {
    color: red;
    font-weight: bold;
}

El HTML se refiere al CSS utilizando los atributos idy class. Podría verse más o menos así:


<div id="top">
	<h1>Cerry de chocolate</h1>
	<p class="intro">Esta es mi receta para hacer curry con chocolate</p>
	<p class="intro">Mmm mm mmmmm</p>
</div>

La diferencia entre una ID y una clase es que una ID se puede usar para identificar un elemento, mientras que una clase se puede usar para identificar más de uno.

También puede aplicar un selector a un elemento HTML específico simplemente indicando primero el selector HTML, por p.mermelada { /* lo que sea */ } lo que solo se aplicará a los elementos de párrafo que tengan la clase "memelada".

CITAR ARTÍCULO


Para tareas, investigaciones, tesis, libros, revistas, blogs ó artículos académicos

Referencia en Formato APA:

Delgado, Hugo. (2020).
Diferencias entre Class y ID - Ejemplo de uso en HTML y CSS.
Recuperado 23 de mayo, 2020, de
https://disenowebakus.net/class-id.php

¡Participa!

¡Compártelo con tus amigos en Redes Sociales!
Compartir en:

Profesor en la Universidad de Guadalajara

Hugo Delgado Desarrollador y Diseñador Web en Puerto Vallarta

Profesional en Desarrollo Web y Posicionamiento SEO desde hace más de 15 años continuos.
Contamos con más de 200 constancias y reconocimientos en la trayectoria Académica y Profesional, incluidos diplomados certificados por Google.

CONTINÚA APRENDIENDO

TAMBIÉN MERECE LA PENA VISITAR:

¿Todavía no encuentras lo que necesitas?

Usa nuestro buscador interno para descubrir más información
Contenido patrocinado:

¿Te gustaría aprender más sobre Diseño Web?

Conoce todos los cursos y tutoriales que tenemos para ti completamente gratis
Aprender Diseño Web
 

Deja tu Comentario