Obter os feitos con este curso curto en CSS
As follas de estilo en cascada teñen moitos beneficios. Permiten que use a mesma folla de estilo en todo o sitio web. Existen dúas formas de facelo:
- ligando co elemento LINK
- importación co comando @import
-
- url @import ('http://www.yoursite.com/styles.css');
-
Vantaxes e desvantaxes de follas de estilo externas
Unha das mellores cousas sobre as follas de estilo en cascada é que pode usalas para manter o seu sitio consistente. A forma máis sinxela de facelo é ligar ou importar unha folla de estilo externa. Se usa a mesma folla de estilo externa para cada páxina do seu sitio, pode estar seguro de que todas as páxinas terán os mesmos estilos.
Algunhas das vantaxes de usar follas de estilo externas inclúen que pode controlar o aspecto de varios documentos á vez. Isto é especialmente útil se traballas cun equipo de persoas para crear o teu sitio web. Moitas regras de estilo poden ser difíciles de recordar e, aínda que poida ter unha guía de estilo impreso, é tedioso ter que voltear constantemente para determinar se o texto de exemplo está escrito en fontes Arial de 12 puntos ou mensaxes de 14 puntos.
Pode crear clases de estilos que se poidan usar en moitos elementos HTML diferentes. Se adoita empregar unha fonte Wingdings especial para dar máis énfase a varias cousas na súa páxina, pode usar a clase Wingdings que configurou na súa folla de estilo para crealas en lugar de definir un estilo específico para cada instancia da énfase.
Pode agrupar facilmente os seus estilos para ser máis eficiente. Todos os métodos de agrupamento que están dispoñibles para CSS pódense empregar en follas de estilo externas, o que lle proporciona máis control e flexibilidade nas súas páxinas.
Dito isto, hai tamén boas razóns para non usar follas de estilo externas. Por unha banda, poden aumentar o tempo de descarga se ligan a moitos deles.
Cada vez que cree un novo ficheiro CSS e vincule ou importe no seu documento, isto require que o navegador web faga outra chamada ao servidor web para obter o ficheiro. As chamadas dos servidores retardan os tempos de carga da páxina.
Se só tes un pequeno número de estilos, poden aumentar a complexidade da túa páxina.
Porque os estilos non están visibles no HTML, quen busca a páxina ten que obter outro documento (o ficheiro CSS) para descubrir o que está a suceder.
Como crear unha folla de estilo externa
As follas de estilo externas están escritas do mesmo xeito que as follas de estilo incorporadas e en liña. Pero todo o que necesitas escribir é o selector de estilo e a declaración . Non necesita un elemento ou atributo STYLE no documento.
Do mesmo xeito que con todos os outros CSS, a sintaxe para unha regra é:
selector {propiedade: valor; }
Estas regras están escritas nun ficheiro de texto coa extensión .css. Por exemplo, pode chamar a súa folla de estilo styles.css.
Unha vez que teña un documento de folla de estilo, debes ligalo ás túas páxinas web. Como mencionei anteriormente, isto faise de dous xeitos.
Ligando documentos CSS
Para vincular unha folla de estilo, emprega o elemento LINK. Isto ten os atributos rel e href. O atributo rel indica ao navegador o que está ligando (neste caso, unha folla de estilo) eo atributo href mantén a ruta cara ao ficheiro CSS.
Tamén hai un tipo de atributo opcional que pode usar para definir o tipo MIME do documento vinculado. Isto non é necesario en HTML5, pero debe ser usado en documentos HTML 4.
Aquí está o código que usaría para vincular unha folla de estilo CSS chamada styles.css:
E nun documento HTML 4 escribirías:
type = "text / css" >
Importando follas de estilo CSS
As follas de estilo importadas colócanse dentro do elemento STYLE. Tamén pode usar estilos incorporados se o desexa. Tamén pode incluír estilos importados dentro de follas de estilo ligadas. Dentro do documento STYLE ou CSS, escriba:
url @import ('http://www.yoursite.com/styles.css');