Recomendados
Más contenido relacionado
Similar a Id’s y classes
Similar a Id’s y classes (20)
Último
Último (20)
Id’s y classes
- 1. ID’s y Classes y DisenoBasico Mas HTML y CSS
- 2. Que es un Class? Un Class es un grupo de elementos especiales. Puede ser muchos elementos del mismo class en la misma pagina. Son diferenciada desde los elementos que no tienen Class Las reglas de un Class son aplicado sobre las reglas de un elemento. En HTML los Class aparecen asi: <divclass=“texto”></div> En CSS los Class aparecen asi: .texto
- 3. Que es un ID? Un ID es la identificador o identificacion por un elemento. Cada id solamente puede aparecer una sola vez en cada pagina. Como solamente puede ser utilizada una vez las reglas CSS que estan conectado a los ID son considerado mas importante de los Class. Las reglas de un ID son aplicado sobre las reglas de un class o elemento En HTML aparecen asi: <div id=“cabeza”> </div> En CSS aparecen asi: #cabeza
- 4. Porque necesitamos Ids y Classes? Necesitamos los Ids y Class para poner estilos diferentes en partes de la pagina web. Los ID son utiles para seleccionar una area especifica. Normalmente lo utiliza con <div> para crear los varios partes de la pagina Los Class son utiles para crear estilos que van a ser repetidos en la pagina, con elementos como texto (h1, h2, p,), listas (ol, ul, li), y con imágenes (img) o vinculos (a).
- 5. Usos Communes de ID’s y Classes
- 6. Diseño común de una Pagina de Web
- 7. El Codigo <body> <div id=“contenedor”> <div id=“cabeza”></div> <div id=“navegacion”></div> <div id=“columna1”></div> <div id=“pie”></div> </div> </body>
- 8. Creando el Contenedor Selector: #contenedor Background-Color: #e9e9e9 Border Style: Solid BorderWidth: 1px Margin-Left: auto Margin-Right: auto Width: 720px
- 9. Creando la Cabeza Selector: #cabeza Background Color: #ffffff Border Style-Bottom: Solid BorderWidth-Bottom: 1px Width: 720px Height: 125px
- 10. Creando la Navegación Selector: #navegacion Background-color:#ffffff Border Style: Solid BorderWidth: 1px Margin 10px Padding 10px Width: 178px Float: Left
- 11. Creando la Columna Selector: #columna 1 Background-color:#ffffff Border Style: Solid BorderWidth: 1px Margin 10px Padding 10px Width: 458px Float: Right
- 12. Creando el Pie Selector: #pie Background Color: #ffffff Border Style-Top: Solid BorderWidth-Top: 1px Width:720px Height:130px Clear:Both
- 13. Poniendo el Fondo Selector: body BackgroundImage: Background.jpg Background Position: Fixed Font Size: 62.5%