Hola amigo, te comento:
Como primero lo que deberiamos tener en cuenta es que existen elementos en HTML, estos elementos (h1, h2, p, a img, form, div o lo que sea) pueden ser unicos en la pagina o pueden estar repetidos.
Es decir por ejemplo encabezados hay uno en la pagina, al menos generalmente, entonces si definimos un div para un encabezado, podemos colocaremos en el HTML
Código HTML:
<div id="header">
<h1>El titulo de mi paginas</h1>
<p>Mi pagina es para que entres y la veas :)</p>
</div>
Ese podria ser un encabezado en HTML para la pagina, ahora si yo quiero que ese encabezado sea instanciado en el css tengo 2 formas:
Código HTML:
div{ aqui pongo las propieedades del div }
o
Código HTML:
div#header{ aqui pongo las propieedades del div }
Cual es la direfencia? bueno, la diferencia principal es que del primer modo cada vez que coloques un elemento div en la pagina tomara las propiedades que pusiste. En cambio de la segunda forma solo cambiara o dara las propiedades que colocaste en el div que contenga el id="header", es decir:
Si tenes un elemento con un id="ejemplo" en el html, la forma de instanciarlo en el css es
#ejemplo
Ademas una caracterisitica de usar ID es que solo puede utilizarse 1 vez, es decir si colocas un id es porque es unico en la pagina. Ahora si es un elemento que esta repetido muchas veces y le queres dar un estilo, entonces tenes que utilizar class, por ejemplo de la siguiente forma:
Código HTML:
<div id="contenido">
<h2>noticia 1</h2>
<p class="noticia">aqui ponemos el resumen de la noticia y aparecera en el formato que le de al css</p>
<h2>noticia 2</h2>
<p class="noticia">aqui ponemos el resumen de la noticia y aparecera en el formato que le de al css</p>
<h2>noticia 3</h2>
<p class="noticia">aqui ponemos el resumen de la noticia y aparecera en el formato que le de al css</p>
</div>
Si tenes un elemento con un class="ejemplo" en el html, la forma de instanciarlo en el css es
.ejemplo{}
------------------------------------------------------------------
Ademas las estructuras de las paginas son complejas generalmente, es decir que la forma de instanciar elementos es instanciar todo los elementos que lo contienen y el mismo elemento luego, esto permite además heredar propiedades de los elementos padres, como tamaños, tipografias, fondos, etc.
La mejor forma de armar un html con css es tener estructuras de html claras, y ordenadas, te recomiendo que te busques un tutor o un curso de estas dos cosas para poder aprender como armar bien als cosas y para que sirve cada elemento y con el tiempo y practicas aprenderas cual es la mejor forma de trabajar, es decir la que te ahorra mucho tiempo en la creacion y actualizacion de paginas.
espero que te sirva si tenes alguna duda pregunta
