Curso de HTML + CSS Por Tu Padre z Raze PDF

Preview

Summary

Solo ignoralo...

Description

Curso De HTML + CSS Por Tu Padre zRaze HTML es el lenguaje base con el que se hacen las páginas web, por eso, cualquier aprendizaje de creación de páginas web debe empezar con un repaso, más o menos profundo, sobre este lenguaje. Para este curso de HTML no se necesita ningún software específico. Se puede usar cualquier editor de texto, incluso, por ejemplo, el popular bloc de notas de Windows, pues realmente lo único que necesitamos es poder escribir texto plano. aunque es recomendable algún programa que ayude en la visualización del código. Existen decenas de software que te ayudan en la visualización de código Html. Uno de los más conocidos es el Adobe Dreamweaver pero puedes usar cualquier otro similar.

Estructura básica de una página web La estructura básica de una página web es la siguiente: Una estructura HTML se empieza con la etiqueta y acaba con . Todo lo que esté en medio será

la página web.

Dentro de

se

encuentran 2 partes diferenciadas. La primera es la cabecera de la página. Aquí irán cierta información que no.

Tablas HTML Una tabla en html viene marcada por las etiquetas . Entre esas dos etiquetas definiremos la tabla, las celdas que queremos, las columnas y las características de cada uno de estos parámetros. Pero vamos a empezar explicándote la etiqueta .

Listas HTML Listas no ordenadas: Las listas no ordenadas van dentro de la etiqueta HTML y de su cierre . Cada punto

que queramos añadir a la lista, lo haremos dentro de la etiqueta y su cierre. Si no le indicamos nada a la etiqueta HTML, ésta se generará de forma automática.

Imágenes HTML Poner imágenes en nuestra web produce unos resultados asombrosos de una manera muy fácil. Vamos a mostrarte como puedes incluir una imagen y los atributos que puedes darle a la misma. El tag básico para colocar una imagen es “img“. Este tag, a diferencia de la gran mayoría de los tags de html, no necesita

Mapas de imágenes HTML nos permite la opción de crear diferentes enlaces url dentro de una misma imagen. Es decir, podemos hacer que diferentes partes de una imagen tengan enlaces que nos permitan ir a diferentes destinos. Las fotos en las que queramos introducir un mapa de imágenes deberán ser de uno de estos tres formatos: .jpg, .gif.

Enlaces HTML Los enlaces en HTML nos permiten de una manera muy cómoda redirigir al usuario a otra parte, cuando éste pinche en dicho enlace. Podemos hacer que el usuario se vaya a otra url distinta a la que está, o podemos hacer que vaya a otra parte pero dentro del mismo archivo en el que está.

Para crear estructuras web, se hace desde Visual Studio Code https://code.visualstudio.com/ Descarga eso puto xd

Continuación a CSS

CSS, son un conjunto de instrucciones que definen la apariencia de diversos elementos de un documento HTML. El html posee ciertas limitaciones a la hora de aplicarle forma a un documento. Pero con las hojas de estilo, somos capaces de superar esas limitaciones. Las CSS complementan al lenguaje HTML, dándole

Cómo incluir estilos CSS CSS Directas Las CSS directas se usan para poder incluir CSS a una parte del texto concreta. Para ello debemos utilizar la etiqueta “style”. Observa el siguiente código de ejemplo: “X” sería la etiqueta html a la que se le ha aplicado el estilo, mediante el parámetro “style”. “X” puede ser un párrafo ()

Texto y párrafos en CSS Los siguientes estilos se aplican a los párrafos. Podemos cambiar el alto de la línea, darle una decoración al párrafo, alinearlo, etc. Vamos a verlos más detalladamente a continuación. Estilo CSS text-

decoration Este estilo lo utilizaremos para darle un aspecto diferente al párrafo. Así podremos subrayarlo (underline), sobrerayarlo (overline) o tacharlo (line-through).

Margin CSS y padding CSS Estilo CSS margin-bottom Gracias a este atributo indicaremos el tamaño que tendrá el margen de la parte inferior de la página. La indicación será mediante unidades de medida de CSS. Estilo CSS margin-top Gracias a este atributo indicaremos el tamaño que tendrá el margen de la parte superior de la página.

Float CSS y clear CSS Float CSS El estilo “float” sirve para alinear un elemento, haciendo que el texto de alrededor del mismo se agrupe entorno a dicho elemento. Sus posibles valores son “left” (para alinear el elemento a la izquierda) y “right” (para alinearlo a la derecha).Un elemento con float CSS debe tener definida su anchura.

Diseño por capas: z-index CSS Estilo CSS z-index Mediante el estilo z-index CSS podemos ordenar los elementos de nuestra página web a nuestro gusto. z-index crea una capa nueva que tiene un nivel o una

altura diferente al resto de las capas. Observa el siguiente código: Lo primero que observamos es que la capa posee una posición.

Visibility y display CSS Estilo visibility CSS El estilo CSS visibility de una capa controla si ésta será visualizada o no. Para determinar eso, posee dos valores: “visible” y “hidden”. La característica de este estilo es que aunque el elemento no sea visible, continúa ocupando su espacio en el flujo del HTML. Todo lo contrario ocurre con el estilo “display”

Overflow CSS Estilo CSS overflow Como ya hemos dicho en un artículo anterior, este estilo especificará al navegador el trato que tiene que darle a un texto que no cabe en el espacio que le hemos especificado. Los valores de este estilo pueden ser cuatro: Visible: El navegador expandirá el tamaño del documento hasta que encaje todo.

Scroll CSS La etiqueta css “scrollbar” es una excelente forma de darle un toque personalizado a nuestra página web de una forma sencilla. Gracias a esta etiqueta podemos cambiar el color de la barra desplazadora y configurar totalmente los colores de la misma. Esta etiqueta deberemos incluirla entre las etiquetas .

Suscribete a mi canal puto xd

https://www.youtube.com/channel/UCIPikSzydr1uYAtSX61rDs Q...