css - plugin - body_class filter

ID de CSS vs clase

Question

¿Cuál es la diferencia básica entre CSS ID y CSS Class?

Alguien me dijo que ID solo se puede usar una vez en una página. Pero descubrí que se puede usar varias veces.

me gusta

body
{
        background-color: #3399FF;
}

div#menuPane{
    position: absolute;
    left: 25px;
    top: 25px;
    width: 25%;
}

div.menu {
    display: block;
    font-size: 14px;
    margin: 0;
    padding: 0;
    border: 2px solid #7FC07F;
}

div.menu a {
    display: block;
    font-weight: bold;
    text-decoration: none;
    text-align: right;
    letter-spacing: 1px;
    margin: 0px;
    color: black;
    border-top: 1px solid #487048;
}

div.menu a:link{
    background: #33CCFF;
}

div.menu a:visited{
    background: #33CCFF;
}
div.menu a:hover{
    background: #3FC73F;
    letter-spacing: 2px;
}

div.menu h4{ 
    padding: 2px;
    margin: 0px;
}

div#content{
    position: absolute;
    left: 30%;
    top: 25px;
    width: auto;
    border: 2px double #7FC07F;
    background-color: #33CCFF;
    padding: 2px;
    margin-right: 5px;
}

div#content h3{
    background-color: #A3F4A3;
    text-align: right;
    letter-spacing: -1px;
    color: #386938;

    border-bottom: 1px solid black;
}

div#content a:link, a:visited{
    background:#0099FF;
    color: #A3F4A3;
    letter-spacing: 1px;
}

div#content a:hover{
    background: #FF0000;
    color: #A3F4A3;
    letter-spacing: 1px;
}   

Answer 1

.class afectará los elementos que coincidan con el valor en el atributo "clase". style by id afectará los elementos que coincidan con el valor en el atributo "id".

se recomienda que no repita el valor de ID en los elementos, ya que se supone que es el identificador único del elemento en la página actual.

Answer 2

Piensa en ID como tu ID de estudiante. Solo uno existe en tu escuela: el tuyo. Piense en la clase como un grupo de niños ... todos los cuales pertenecen a la misma clase: "Biología". Si desea dirigirse a un estudiante específico, lo haría al reconocer su ID, ya que nunca se dirigirá a más de un alumno. Si desea dirigirse a un grupo de estudiantes, puede hacerlo reconociendo su clase: "La clase de biología disfrutará de pizza hoy" frente a "Jonathan Sampson disfrutará de pizza hoy".

<students>
  <student id="jonathan-sampson" class="biology" />
  <student id="lizza-matthews"   class="earth-science" />
  <student id="michelle-andrews" class="biology" />
</students>

Para llevar:

• ID = ID del estudiante (las escuelas no emiten identificaciones idénticas para varios estudiantes)
• CLASE = Grupo de estudiantes (como ''The Biology Class'' irá en una excursión de campo)

Answer 3

Solo se puede asignar a un elemento de la página, pero se puede usar en varias reglas de CSS. Los nombres de clase se pueden asignar a múltiples elementos en la página.

Answer 4

Una nota final: algunos navegadores permitirán múltiples valores idénticos de "id", pero definitivamente no debes hacer esto ya que se romperá en los navegadores que siguen las normas.

Answer 5

Id es para identificar de forma única cualquier elemento en la página html. Tiene un propósito especial. Por favor, vaya a este enlace para una mejor explicación
Diferencia entre id y clase en CSS

Answer 6

Vea esta respuesta para una descripción de las diferencias.

En general, utilizas los identificadores para diseñar algo que sabes que solo va a aparecer una vez, por ejemplo, cosas como divs de diseño de alto nivel, tales como barras laterales, áreas de pancartas, etc.

Las clases se usan donde se repite el estilo, por ejemplo, si encabeza una forma especial de encabezado para los mensajes de error, podría crear un estilo h1.error {} que solo se aplicaría a