Entradas

Mostrando entradas de julio, 2019

Conceptos básicos de HTML: Imágenes

Imagen
La etiqueta <img> Esta etiqueta se usa cuando queremos insertar una imagen y esta solo contiene atributos, tampoco hay una etiqueta de apertura y otra de cierre y se ve así: El atributo src se utiliza para encontrar la URL (dirección) de la imagen. Ubicación de la imagen La imagen que queramos insertar en nuestra pagina debe de estar en la misma ubicación que nuestro archivo HTML, especificandolo con el atributo src y poniendo el nombre de la imagen entre las casillas junto su extensión. En caso de que la imagen no pueda mostrarse, el atributo alt  especifica en palabras el porque no se mostró. Este atributo es importante. Cambio del tamaño de las imagenes. Para cambiar el tamaño de las imagenes se usan los atributos de largo y ancho (height y widht): Borde de la imagen Las etiquetas por defecto no tienen borde, si queremos agregar un borde lo podemos hacer con la etiqueta border :

Conceptos básicos HTML: Atributos

Imagen
Atributos Los atributos se encargan de darle información a los elementos al mismo tiempo que pueden modificarlos, ya que casi todos los atributos tienen un valor y este valor a su vez modifica el atributo. En este ejemplo podemos observar el atributo align y le damos al valor center para que nos de el siguiente resultado: Los atributos siempre deben de especificarse en la etiqueta de apertura del elemento que queremos modificar. Mediciones de atributos Por ejemplo podemos modificar una linea para que tenga un ancho de 60 pixeles. Esto se hace con el atributo width: Esto de igual manera se puede hacer en porcentaje. Atributo de  alineación Estos atributos como su titulo lo dice son aquellos que usamos para alinear nuestro texto de la manera que lo necesitemos. Por ejemplo podemos hacer un texto alineado al centro y una linea alineada hacia la izquierda, así: Dando esto como resultado:

Conceptos básicos de HTML: Elementos

Imagen
Elementos HTML Podemos decir en pocas palabras que los elementos HTML son todas sus etiquetas. Hay algunos elementos pequeños que no tienen etiquetas de apertura y cierre, son elementos individuales como es el caso de la etiqueta <br>. Ejemplo:

JavaScript externo

Imagen
Los scripts también se pueden usar en archivos externos al igual que CSS como lo vimos en ese curso. Esto es muy útil cuando vamos a usar el mismo código en diferentes paginas web y se guarda con la extensión .js Para usar el JavaScript externo solo tenemos que colocar su nombre dentro de la etiqueta <script> del documento HTML agregándole al atributo src de esta manera: Y en el archivo JavaScript  de esta manera: El resultado será el mismo que cuando incluimos el JavaScript al archivo HTML. También podemos crear una referencia ya sea en <head> o en <body> donde usted lo prefiera. Las ventajas de hacer esto es que podemos separar el HTML del código, hacer que las paginas sean más rápidas y archivos sean legibles.

Reglas y selectores de CSS

Imagen
Sintaxis CSS CSS se compone de algunas reglas de estilo que el navegador entiende y luego aplica y esto se basa es tres simples partes. Por ejemplo si queremos definir el color de un titulo lo que debemos tener en cuenta es lo siguiente: h1 {color: purple} Al elemento h1 se le denomina selector ya que seleccionamos que formato vamos a usar, al elemento color se le denomina propiedad ya que es lo que queremos que se le aplique al formato y al elemento purple se le denomina valor ya que es la manera en que la propiedad se va a aplicar. Selectores de tipo Los selectores de tipo son los más comunes y faciles de usar ya que este apunta a todos los tipos de elementos de la pagina. Por ejemplo en el siguiente codigo usamos el selector de tipo para todos los parrafos: Selectores de id y clase Estos selectores permiten aplicar un estilo a un elemento HTML que tenga un atributo id, independientemente de donde se encuentre ubicado. Por ejemplo: EN

Visión General JavaScript

Imagen
La etiqueta <script> Esta etiqueta puede tomar dos atributos, lenguaje y tipo, que especifican la secuencia de comandos. El atributo lenguaje ya no esta en uso, por lo tanto no lo debemos de usar pero queria compartirles por si alguna vez ven un archivo HTML antiguo. Ahora en modo de ejemplo vamos a hacer un cuadro de alerta en nustra pagina web de esta manera: Y este es el resultado del navegador, las cosas se están poniendo interesantes y se pondrán aún mejor.

Introducción a JavaScript

Imagen
Nuestro primer JavaScript Vamos entonces a empezar a agregar nustro JavaScript a la pagina web. Tengamos en cuenta que JavaScript vive dentro de el archivo HTML asi que los scripts estaran encerrados por las etiquetas <script></script>. El <script> puede ponerse entre las etiquetas <head> y <body>, pero debemos tener en cuenta que si lo ponemos en head se ejecutara primero que el cuerpo de nuestra pagina que es a la que le daremos lo interactivo. Ahora vamos a usar esto para imprimir un mensaje en la web: La función document.write()  escribe una cadena de caracteres para luego imprimirla así: Formato de texto Podemos usar las etiquetas HTML en los scripts para darle los formatos que ya hemos visto antes, así:

Lo básico: En línea, integrado, CSS externo

Imagen
CSS en línea Usar un estilo de linea es una  manera de insertar una hoja de estilo, en este caso de CSS en linea solo se le aplica a un elemento o etiqueta que se quiera estilizar. En este ejemplo vemos como usando CSS podemos darle al párrafo un fondo negro y letra color azul. CSS integrado/interno Para aplicar este método  se define la etiqueta <style> dentro de un encabezado (<head>). Al usar este método el estilo ya no se le da solo a una linea sino a todos los elementos que tienen el estilo aplicado en la etiqueta <style>. Y este es el resultado, de verdad que es de gran utilidad esto cuando la página esta muy grande. CSS externo Este metodo se utiliza teniendo un archivo guardado con la extensión .css donde estaran todos los valores que le queramos dar a la estructura de un documento HTML. Ejemplo Con este archivo aparte iremos al archivo HTML y luego llamaremos con la etiqueta <link> a este archivo para que

Conceptos básicos de HTML: Encabezados, líneas, comentarios

Imagen
Encabezados HTML Para los encabezados en HTML tenemos seis etiquetas que van desde mayor a menor según su importancia: <h1>, <h2>, <h3>, <h4>, <h5>, <h6>. Este es el resultado en el navegador: No se recomienda usar encabezados para hacer la letra grande y en negrita ya que los motores de busqueda los usan para indexar la pagina. Si quieres agregar propiedades a tu texto puedes ver la entrada donde explico cuales son aquí . Lineas horizontales Para hacer una linea se usa la etiqueta <hr>, esto es HTML significa una roptura temática. Así se ve en el navegador: Comentarios Los comentarios no afectan en absoluto el archivo HTML y de igualmanera los navegadores tampoco lo muestran. Se usan para hacer de tu archivo un codigo legible dandole recordatorios, indicaciones y lo que quieras ponerle. La etiqueta para comentarios es esta: <!- Aquí va el comentario -> (el signo de exclamación solo esta e

Visión General: ¿Qué es HTML?

Bienvenido a HTML HTML significa Hyper Text Markup Language (Lenguaje de marcado de hipertexto) A diferencia de un lenguaje de programación que usa scripts para hacer sus funciones, HTML usa etiquetas para identificar el contenido de sus funciones. Un ejemplo seria algo como esto: <p>Esto es un párrafo</p> Estructura Web La capacidad que se puede alcanzar codificando con HTML es fundamental para cualquier profesional. Si alguien quiere empezar a crear paginas web tiene que tener el conocimiento sobre esta habilidad ya que podríamos decir que es el punto de partida para cualquier desarrollador. Estructura: HTML = Estructura CSS = Presentación JavaScript = Comportamiento

Conceptos básicos: ¿Qué es Python?

Bienvenido a Python Python es un lenguaje de programación de alto nivel que se usa en muchas áreas, como son la programación de paginas web, scripts, computación científica e inteligencia artificial. Este lenguaje en muy usado por algunas organizaciones como Google, La Nasa, La CIA y Disney. Aquí les dejo el link de descarga para la aplicación Python: Descargar Python

Lo básico: ¿Qué es CSS?

Bienvenidos a CSS CSS significa  C ascading  S tyle  S heets ( Hojas de estilo en cascada) . -  Cascada se  refiere a la forma en que CSS aplica un estilo sobre otro.  -  Las hojas de estilo  controlan la apariencia de los documentos web.  CSS  y  HTML  trabajan de la mano:  - HTML ordena la estructura de la página.  - CSS define cómo se muestran los elementos HTML.  El principal beneficio que nos brinda CSS es separar el estilo que le damos a la página del contenido que esta tiene, y es una muy buena practica ya que se vuelve dificil manejar todo en un mismo lugar cuando la página crece. Así que les deseo suerte en este curso y espero que hayan visto el de HTML para que puedan entender mucho mejor este.

Conceptos básicos de HTML: Formatos de texto

Imagen
Elementos de formato En HTML hay varias etiquetas para especificar el tipo de texto en el contenido de nuestra página. Este es el resultado de cada una de las etiquetas para formato de texto, ahora es tu decisión saber cual debes usar en tu página.

Conceptos básicos de HTML: Párrafos

Imagen
La etiqueta <p> Para crear un párrafo, como cualquier otra etiqueta, se escribe el elemento <p> con sus etiquetas de apertura y cierre. Este es el resultado en el navegador: Salto de linea <br> El elemento <br> es una etiqueta vacia asi que no tienen etiqueta de cierre. Usar esta etiqueta se genera un salto de linea sin dejar espacio entre lineas asi: (Herramienta Sublime Text 3) El resultado en el navegador es este: