martes, 19 de marzo de 2019

Mensaje a el usuario

Querido usuario de este blog LA htmlycss quiero informarle que ya no va a haber mas entradas en este blog pero si en el siguiente blog blastcoding.com ya que es mi blog personal de programación no tengo previsto por ahora publicar sobre html y css en tal blog. Desde ya muchas gracias por comprender

martes, 2 de diciembre de 2014

como funciona CSS

Funcionamiento de CSS

CSS funciona a base de reglas. Las hojas de estilo están compuestas por una o más de esas reglas aplicadas a un documento HTML o XML. La regla tiene dos partes: un selector y la declaración. A su vez la declaración está compuesta por una propiedad y el valor que se le asigne.

h1 {color: red;}
h1 es el selector
{color: red;} es la declaración

el texto anterior fue copiado de w3.es para que sea lo mas claro posible el funcionamiento de CSS.

CSS lo podemos usar dentro de nuestra pagina o desde fuera de la misma:

usando las etiquetas <style> css aqui </style> dentro de el elemento head.
Tambien se puede usar el atributo style donde se quiera dar el el estilo.
desde fuera de la pagina haciendo referencia con el elemento link dentro de el elemento head.

Vamos a los ejemplos:

ejemplo 1: dentro de la misma pagina usando el elemento style entre <head></head>.


<html>

  <head>

     <title>ejemplo de css interno</title>

     <style>

     h1{

       color: red;

     }

     </style>
 
</head>
 
<body>

     <h1>tendre color rojo<h1> 
 
</body>

</html>

ejemplo 2: dentro de la misma pagina (atributo style).


<html>

   <head>

      <title>ejemolo de css inline</title>
  
</head>
 
<body>

     <h1 style="color:red;">tendre color rojo<h1> 
 
</body>

</html>

a esta clase de estilo se le suele llamar inline style

ejemplo 3: desde fuera de la pagina.


<html>

   <head>

      <title>ejemplo de css externo</title>

      <link rel="stylesheet" type="text/css" href="cssexterno.css">

   </head> 

   <body>

      <h1>encabezado con css</h1>

      <p>parrafo con css</p>

   </body>

</html>

lunes, 1 de diciembre de 2014

elemento nav

El elemento nav representa una sección con links de navegación.

¿Para qué sirve?
El elemento nav sirve para localizar el bloque principal de navigación de la pagina.

ejemplo de uso:


<nav>

   <ul>

       <li><a href ='#'>link 1</a></li>

       <li><a href ='#'>link 2</a></li>

       <li><a href ='#'>link 3</a></li>     

   </ul>

</nav>

viernes, 28 de noviembre de 2014

Encabezados (h1 a h6)

Los encabezados en html van desde h1 a h6 donde h1 es el de tamaño mayor por defecto
y veamos algo de codigo y como seria interpretado


<h1>este es un encabezado h1 </h1>

<h2> este es un encabezado h2 </h2>

<h3> este es un encabezado h3 </h3>

<h4> este es un encabezado h4 </h4>

<h5> este es un encabezado h5 </h5>

<h6> este es un encabezado h6 </h6>

pd: no pruebe esto en un blog, los blog están condicionados por el css que utiliza la plantilla del blog y no mostrara los encabezados tal cual son.

como se veria el codigo anterior en el blog:

este es un encabezado h1

este es un encabezado h2

este es un encabezado h3

este es un encabezado h4

este es un encabezado h5

este es un encabezado h6

Titulo de Pagina (title)

Con la etiqueta title definimos el titulo de nuestra pagina y cuando digo el titulo se trata del titulo que aparece aqui:

donde dice google- Buscar con Google -eso es el titulo de la pagina
Bueno ahora lo haremos nosotros, cree un archivo html con el nombre titulo.html y ecriba el siguiente codigo.


<html>

   <head>

      <title>que titulo?</title>

   </head>

   <body>

   </body>

</html>

se vera asi:

vea que la etiqueta <title></title> va entre las etiquetas <html></html>, tambien vea que talvez nuestro ? no aparezca en el titulo como tal eso lo veremos luego.
si no sabes como probar el codigo (como probar tu codigo)
luego de probar el codigo deveria quedar asi:

recuerde que entre las etiquetas body(cuerpo de la pagina) no escribimos nada por lo tanto la pagina la vera en blanco.

jueves, 27 de noviembre de 2014

elemento p (parrafos)

el elemento p indica que todo lo que esta entre <p> y </p> se representara como parrafo

ejemplo:


<p> 

Aliquam tristique viverra vehicula. Pellentesque habitant morbi 
tristique senectus et netus et malesuada fames ac turpis egestas. 
Quisque ut ornare ex. Morbi varius, eros non maximus tincidunt, nisl 
odio blandit nulla, sit amet commodo ante tellus sodales orci. Fusce 
vitae magna sed diam convallis lobortis at quis purus.

</p>

¿Que es HTML y CSS?

HTML-¿que significa HTML?
bueno, las siglas HTML significan Hypertext Markup Lenguage,el cual es el lenguaje que describe la estructura de las paginas web y fue creado por Tim Berners-Lee fundador de la W3C a principio de los 90(1990).

Ejemplo
<html>
<head>

</head>
<body></body>
</html>

CSS
las siglas CSS significan Cascading Style Sheets(Hojas de estilo en cascada) y se le usa para dar estilos no tiene por que ser html.
Su uso en general es para darle estilos a las paginas web.

ejemplo:

p{
color:black;
}

JQuery functions