Diferencia entre revisiones de «Lenguaje HTML/Estilos CSS»

Contenido eliminado Contenido añadido
Sin resumen de edición
mSin resumen de edición
Línea 41:
|-
|}
 
 
==Tabla de colores==
 
 
Los colores se pueden especificar en páginas HTML de dos maneras una especificando el nombre del color y otra usando una numeración para denotar un valor de color del sistema RGB. Un valor del color del RGB consiste en tres números hexadecimales de dos dígitos que especifican la intensidad del color correspondiente.
 
Por ejemplo, el valor #FF0000 del color se hace rojo porque el número rojo se fija a su valor más alto, FF (o 255 en forma decimal).
 
 
 
 
<table bgColor="GRAY" border="1" cellPadding="0" cellSpacing="2">
<tr>
<td align="center" style="BACKGROUND: aliceblue">aliceblue<br>(#F0F8FF)</td>
<td align="center" style="BACKGROUND: antiquewhite">antiquewhite<br>(#FAEBD7)</td>
<td align="center" style="BACKGROUND: aqua">aqua<br>(#00FFFF)</td>
<td align="center" style="BACKGROUND: aquamarine">aquamarine<br>(#7FFFD4)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: azure">azul<br>(#F0FFFF)</td>
<td align="center" style="BACKGROUND: beige">amarillento<br>(#F5F5DC)</td>
<td align="center" style="BACKGROUND: bisque">bisque<br>(#FFE4C4)</td>
<td align="center" style="BACKGROUND: black">negro<br>(#000000)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: blanchedalmond">blanchedalmond<br>(#FFEBCD)</td>
<td align="center" style="BACKGROUND: #0000ff">azul<br>(#0000FF)</td>
<td align="center" style="BACKGROUND: #8a2be2">blueviolet<br>(#8A2BE2)</td>
<td align="center" style="BACKGROUND: brown">marrón<br>(#A52A2A)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: burlywood">burlywood<br>(#DEB887)</td>
<td align="center" style="BACKGROUND: cadetblue">cadetblue<br>(#5F9EA0)</td>
<td align="center" style="BACKGROUND: chartreuse">chartreuse<br>(#7FFF00)</td>
<td align="center" style="BACKGROUND: chocolate">chocolate<br>(#D2691E)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: coral">coral<br>(#FF7F50)</td>
<td align="center" style="BACKGROUND: #6495ed">cornflowerblue<br>(#6495ED)</td>
<td align="center" style="BACKGROUND: cornsilk">cornsilk<br>(#FFF8DC)</td>
<td align="center" style="BACKGROUND: crimson">carmesí<br>(#DC143C)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: cyan">ciánico<br>(#00FFFF)</td>
<td align="center" style="BACKGROUND: darkblue">azul marino<br>(#00008B)</td>
<td align="center" style="BACKGROUND: darkcyan">darkcyan<br>(#008B8B)</td>
<td align="center" style="BACKGROUND: darkgoldenrod">darkgoldenrod<br>(#B8860B)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: darkgray">gris oscuro<br>(#A9A9A9)</td>
<td align="center" style="BACKGROUND: darkgreen">verde oscuro<br>(#006400)</td>
<td align="center" style="BACKGROUND: darkkhaki">darkkhaki<br>(#BDB76B)</td>
<td align="center" style="BACKGROUND: darkmagenta">darkmagenta<br>(#8B008B)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: darkolivegreen">darkolivegreen<br>(#556B2F)</td>
<td align="center" style="BACKGROUND: darkorange">anaranjado oscuro<br>(#FF8C00)</td>
<td align="center" style="BACKGROUND: darkorchid">darkorchid<br>(#9932CC)</td>
<td align="center" style="BACKGROUND: darkred">rojo oscuro<br>(#8B0000)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: darksalmon">darksalmon<br>(#E9967A)</td>
<td align="center" style="BACKGROUND: darkseagreen">darkseagreen<br>(#8FBC8B)</td>
<td align="center" style="BACKGROUND: darkslateblue">darkslateblue<br>(#483D8B)</td>
<td align="center" style="BACKGROUND: darkslategray">darkslategray<br>(#2F4F4F)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: darkturquoise">darkturquoise<br>(#00CED1)</td>
<td align="center" style="BACKGROUND: darkviolet">darkviolet<br>(#9400D3)</td>
<td align="center" style="BACKGROUND: deeppink">de color rosa oscuro<br>(#FF1493)</td>
<td align="center" style="BACKGROUND: deepskyblue">deepskyblue<br>(#00BFFF)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: dimgray">dimgray<br>(#696969)</td>
<td align="center" style="BACKGROUND: dodgerblue">dodgerblue<br>(#1E90FF)</td>
<td align="center" style="BACKGROUND: firebrick">firebrick<br>(#B22222)</td>
<td align="center" style="BACKGROUND: floralwhite">floralwhite<br>(#FFFAF0)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: forestgreen">forestgreen<br>(#228B22) </td>
<td align="center" style="BACKGROUND: #ff00ff">fuchsia<br>(#FF00FF)</td>
<td align="center" style="BACKGROUND: gainsboro">gainsboro<br>(#DCDCDC)</td>
<td align="center" style="BACKGROUND: ghostwhite">ghostwhite<br>(#F8F8FF)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: gold">oro<br>(#FFD700)</td>
<td align="center" style="BACKGROUND: goldenrod">vara de oro<br>(#DAA520)</td>
<td align="center" style="BACKGROUND: gray">gris<br>(#808080)</td>
<td align="center" style="BACKGROUND: green">verde<br>(#008000)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: greenyellow">greenyellow<br>(#ADFF2F)</td>
<td align="center" style="BACKGROUND: honeydew">ligamaza<br>(#F0FFF0)</td>
<td align="center" style="BACKGROUND: hotpink">hotpink<br>(#FF69B4)</td>
<td align="center" style="BACKGROUND: indianred">indianred<br>(#CD5C5C)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: indigo">añil<br>(#4B0082)</td>
<td align="center" style="BACKGROUND: ivory">marfil<br>(#FFFFF0)</td>
<td align="center" style="BACKGROUND: khaki">de color caqui<br>(#F0E68C)</td>
<td align="center" style="BACKGROUND: lavender">lavanda<br>(#E6E6FA)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: lavenderblush">lavenderblush<br>(#FFF0F5)</td>
<td align="center" style="BACKGROUND: lawngreen">lawngreen<br>(#7CFC00)</td>
<td align="center" style="BACKGROUND: lemonchiffon">lemonchiffon<br>(#FFFACD)</td>
<td align="center" style="BACKGROUND: lightblue">azul claro<br>(#ADD8E6)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: lightcoral">lightcoral<br>(#F08080)</td>
<td align="center" style="BACKGROUND: lightcyan">lightcyan<br>(#E0FFFF)</td>
<td align="center" style="BACKGROUND: lightgoldenrodyellow">lightgoldenrodyellow<br>(#FAFAD2)</td>
<td align="center" style="BACKGROUND: lightgreen">verde claro<br>(#90EE90)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: lightgrey">gris claro<br>(#D3D3D3)</td>
<td align="center" style="BACKGROUND: lightpink">rosa claro<br>(#FFB6C1)</td>
<td align="center" style="BACKGROUND: lightsalmon">lightsalmon<br>(#FFA07A)</td>
<td align="center" style="BACKGROUND: lightseagreen">lightseagreen<br>(#20B2AA)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: lightskyblue">lightskyblue<br>(#87CEFA)</td>
<td align="center" style="BACKGROUND: lightslategray">lightslategray<br>(#778899)</td>
<td align="center" style="BACKGROUND: lightsteelblue">lightsteelblue<br>(#B0C4DE)</td>
<td align="center" style="BACKGROUND: lightyellow">amarillo claro<br>(#FFFFE0)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: lime">cal<br>(#00FF00)</td>
<td align="center" style="BACKGROUND: limegreen">limegreen<br>(#32CD32)</td>
<td align="center" style="BACKGROUND: linen">lino<br>(#FAF0E6)</td>
<td align="center" style="BACKGROUND: magenta">magenta<br>(#FF00FF)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: maroon">marrón<br>(#800000)</td>
<td align="center" style="BACKGROUND: mediumaquamarine">mediumaquamarine<br>(#66CDAA)</td>
<td align="center" style="BACKGROUND: mediumblue">mediumblue<br>(#0000CD)</td>
<td align="center" style="BACKGROUND: mediumorchid">mediumorchid<br>(#BA55D3)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: mediumpurple">mediumpurple<br>(#9370DB)</td>
<td align="center" style="BACKGROUND: mediumseagreen">mediumseagreen<br>(#3CB371)</td>
<td align="center" style="BACKGROUND: mediumslateblue">mediumslateblue<br>(#7B68EE)</td>
<td align="center" style="BACKGROUND: mediumspringgreen">mediumspringgreen<br>(#00FA9A)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: mediumturquoise">mediumturquoise<br>(#48D1CC)</td>
<td align="center" style="BACKGROUND: mediumvioletred">mediumvioletred<br>(#C71585)</td>
<td align="center" style="BACKGROUND: midnightblue">midnightblue<br>(#191970)</td>
<td align="center" style="BACKGROUND: mintcream">mintcream<br>(#F5FFFA)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: mistyrose">mistyrose<br>(#FFE4E1)</td>
<td align="center" style="BACKGROUND: moccasin">moccasin<br>(#FFE4B5)</td>
<td align="center" style="BACKGROUND: navajowhite">navajowhite<br>(#FFDEAD)</td>
<td align="center" style="BACKGROUND: navy">marina de guerra<br>(#000080)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: oldlace">oldlace<br>(#FDF5E6)</td>
<td align="center" style="BACKGROUND: olive">aceituna<br>(#808000)</td>
<td align="center" style="BACKGROUND: olivedrab">olivedrab<br>(#6B8E23)</td>
<td align="center" style="BACKGROUND: orange">anaranjado<br>(#FFA500)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: orangered">naranja-rojo<br>(#FF4500)</td>
<td align="center" style="BACKGROUND: orchid">orquídea<br>(#DA70D6)</td>
<td align="center" style="BACKGROUND: palegoldenrod">palegoldenrod<br>(#EEE8AA)</td>
<td align="center" style="BACKGROUND: palegreen">palegreen<br>(#98FB98)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: paleturquoise">paleturquoise<br>(#AFEEEE)</td>
<td align="center" style="BACKGROUND: palevioletred">palevioletred<br>(#DB7093)</td>
<td align="center" style="BACKGROUND: papayawhip">papayawhip<br>(#FFEFD5)</td>
<td align="center" style="BACKGROUND: peachpuff">peachpuff<br>(#FFDAB9)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: peru">Perú<br>(#CD853F)</td>
<td align="center" style="BACKGROUND: pink">color de rosa<br>(#FFC0CB)</td>
<td align="center" style="BACKGROUND: plum">ciruelo<br>(#DDA0DD)</td>
<td align="center" style="BACKGROUND: powderblue">powderblue<br>(#B0E0E6)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: purple">púrpura<br>(#800080)</td>
<td align="center" style="BACKGROUND: red">rojo<br>(#FF0000)</td>
<td align="center" style="BACKGROUND: rosybrown">rosybrown<br>(#BC8F8F)</td>
<td align="center" style="BACKGROUND: royalblue">royalblue<br>(#4169E1)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: saddlebrown">saddlebrown<br>(#8B4513)</td>
<td align="center" style="BACKGROUND: salmon">salmones<br>(#FA8072)</td>
<td align="center" style="BACKGROUND: sandybrown">sandybrown<br>(#F4A460)</td>
<td align="center" style="BACKGROUND: seagreen">verdemar<br>(#2E8B57)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: seashell">seashell<br>(#FFF5EE)</td>
<td align="center" style="BACKGROUND: sienna">sienna<br>(#A0522D)</td>
<td align="center" style="BACKGROUND: silver">plata<br>(#C0C0C0)</td>
<td align="center" style="BACKGROUND: skyblue">skyblue<br>(#87CEEB)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: slateblue">slateblue<br>(#6A5ACD)</td>
<td align="center" style="BACKGROUND: slategray">slategray<br>(#708090)</td>
<td align="center" style="BACKGROUND: snow">nieve<br>(#FFFAFA)</td>
<td align="center" style="BACKGROUND: springgreen">springgreen<br>(#00FF7F)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: steelblue">steelblue<br>(#4682B4)</td>
<td align="center" style="BACKGROUND: tan">tan<br>(#D2B48C)</td>
<td align="center" style="BACKGROUND: teal">teal<br>(#008080)</td>
<td align="center" style="BACKGROUND: thistle">thistle<br>(#D8BFD8)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: tomato">tomate<br>(#FF6347)</td>
<td align="center" style="BACKGROUND: turquoise">turquesa<br>(#40E0D0)</td>
<td align="center" style="BACKGROUND: violet">violeta<br>(#EE82EE)</td>
<td align="center" style="BACKGROUND: wheat">trigo<br>(#F5DEB3)</td>
</tr>
<tr>
<td align="center" style="BACKGROUND: white">blanco<br>(#FFFFFF)</td>
<td align="center" style="BACKGROUND: whitesmoke">whitesmoke<br>(#F5F5F5)</td>
<td align="center" style="BACKGROUND: yellow">amarillo<br>(#FFFF00)</td>
<td align="center" style="BACKGROUND: yellowgreen">de color verde amarillo<br>(#9ACD32)</td>
</tr>
</table>
 
 
==Atributos==
 
Son la cualidades que podemos afectar en un objeto; en las cascadas de estilos tenemos la posibilidad de dar atributos tan sencillos como la especificación de una familia de fuente o el mismo tamaño en si para un objeto hasta atributos y filtros más complejos como transformaciones de texto, decoraciones, sombras, brillo, desenfoque entre otro.