Creando cont. Display Grid Parte 5

 


Primer artículo “evalain”.


En al area6 tenemos la clase “article” que es la que va a contener cada uno de los artículos de la página. El primero lo vamos a poner dentro de la clase “evalain”

Primero ponemos el título con una etiqueta h2, queremos que aparezca centrado para ello definimos la clase “h2-centrado” que mas tarde le daremos estilo css para que lo centre, a continuación ponemos un espacio en blanco con la etiqueta <br> y después el primer párrafo del articulo con la etiqueta <p>


Al final del articulo ponemos dos líneas de párrafo alineado a la derecha, definimos la clase “p-derecha”.


Y al final del artículo ponemos una línea para diferenciar un artículo de otro con la etiqueta <hr>.


Así es como se vería el artículo originalmente si no le damos formato.





Como podemos ver el area6 que es la zona donde pondremos los artículos corresponde a la clase article y dentro de ella tenemos la clase evalain que es el articulo que estamos haciendo, por tanto, para darle formato css tenemos que hacerlo así.


Resultado.


Ahora queremos que las referencias (dos últimas líneas) nos las ponga alineadas a la derecha, motivo por el cual habíamos definido la clase “p-derecha” (párrafo derecha).






Igualmente le damos estilo al título.



















No hay comentarios:

Publicar un comentario