Introduction aux styles

Cascading style, à partir de maintenant, css

La première chose est d'avoir une idée, même vaguement que c'est le style et qui nous servira dans la conception de pages Web. J'ai copié le cadre d'un article qui va nous donner une idée un peu, l'auteur de cet article est le Directeur de la page desarroWeb.com

Nous sommes allés avec le fond de cette technologie, les raisons qui ont développé des feuilles de style en cascade, et les objectifs qui visent à satisfaire.

Le langage HTML est limitée lors de l'application à une forme de document. C'est parce qu'il a été conçu pour d'autres usages (principalement des scientifiques), à la différence du courant, beaucoup plus grand.

Pour résoudre ces problèmes, les concepteurs ont utilisé des techniques telles que l'utilisation d'images transparentes pour s'adapter à des tables, l'utilisation d'étiquettes qui ne sont pas la norme HTML et d'autres. Ces «pièges» ont souvent causé des problèmes sur les pages lors de la visualisation sur des plateformes différentes.

En outre, les concepteurs ont été frustrés par la difficulté que, même en utilisant ces trucs, ils étaient au moment de la ponte sur les pages, car beaucoup d'entre eux étaient des pages maquetando sur papier, où le contrôle sur la façon dont le document est absolue.

Enfin, un autre précédent qui a nécessité le développement de cette technologie est que les pages Web sont mélangés dans le contenu de votre document HTML avec les étiquettes nécessaires pour façonner. Cela a ses inconvénients, car la lecture du code HTML lee lourd et difficile quand on regarde les erreurs ou les pages de débogage. Bien que, du point de vue de la richesse de l'information et l'utilité des pages lors du stockage de leur contenu est un gros problème que ces textes sont mélangés avec des balises embarquées à façonner celles-ci: il se dégrade leur utilité.

Miguel Ángel Álvarez rapport

Directeur de DesarrolloWeb.com

Il ya plusieurs façons d'utiliser les styles et bien vous ne pouvez pas le savoir, nous avons été

de les utiliser pendant un certain temps, même ici, nous avons vu il n'ya pas longtemps, vouloir mettre un

défiler avec des couleurs spécifiques, un exemple de comment les utiliser. Et aussi souvent vu dans les

visualiser le code source de l'e-mail d'OE.

de los documentos y que tiene este aspecto: Un code qui apparaît dans le chef des documents et qui ressemble à ceci:

1

> Le <style> étiquette avec le type de paramètre = "text / css">

P

{

font-family: "Times New Roman", Times, serif;

font-size: 12px;

font-style: italic;

font-weight: bold;

text-transform: capitaliser;

color: # CC3300;

}

Fermeture de la balise comme nous le savons déjà:

</ Style>

P = un paragraphe

Parmi touche {}

des instructions devant être appliquée à l'étiquette <p>

Cela signifie que nous allons insérer du texte dans un document affiché:

Ceci est un exemple de style, Ceci est un exemple de style,

Ceci est un exemple de style, Ceci est un exemple de style,

Ceci est un exemple de style, Ceci est un exemple de style,

Ceci est un exemple de style, Ceci est un exemple de style,

: Sélection du texte, aller à l'inspecteur des propriétés et le format:

2

convertir la totalité du texte dans un paragraphe. Automatiquement, le style sera appliqué au texte étant comme suit:

stylo1

Pour être en regardant son fonctionnement, il est préférable que vous devriez ouvrir un document entièrement nouveau, pas de modèle ou de quoi que ce soit, un total feuille blanche. Mieux vaut ne pas même se concentrer ... et entrez le texte. : Obtenez le style que j'ai mis ci-dessus et collez-le dans le code source:

3

Agrandir

et convertir votre texte dans un paragraphe. Vous voyez le résultat comme vous l'avez indiqué dans la capture. : Vous pouvez vérifier le code à couleurs changeantes, taille de la police:

4

La couleur est maintenant # 00A000 et 20px taille (toujours mettre px ou pt, px = pixels, PT = points)

Ce serait créer des styles différents et nous appliquer à la main. Mais le rêve est un moyen plus commode de le faire.

etc.. ) insertamos un texto cualquiera: Ouvrez un nouveau document vide (ou le nettoyer une fois ci-dessus) et en essayant de ne pas insérer une étiquette (rappelez-vous, <div> <span> etc ..) insérer du texte:

Dans le menu principal, allez à la fenêtre / de style CSS:

5

Dans la colonne de droite ouvre une nouvelle fenêtre, que si nous travaillons sur un document qui n'a pas encore lié une feuille de style apparaît comme suit:

Cliquez sur l'icône Nouveau pour créer un style:

7

Et il ouvre une nouvelle fenêtre, qui, initialement, peut prendre par défaut et d'autres sélections marqués et nous allons changer cela:

8

Nous allons créer le même style que nous l'avons vu:

9

Et nous acceptons. que esta exactamente igual que el que habíamos puesto manualmente. Si, comme je le disais, nous avons le texte au sein d'une balise de paragraphe, et peut être appliquée automatiquement vérifier le code source est exactement comme celle que nous avons mis manuellement.

, pero todas quedaría igual, es decir, todos los párrafos serian igual, si lo aplicásemos a <td> todas las celdas tendrían el mismo color de fondo , si lo habíamos puesto, mismo color de texto …etc, etc. Nous pourrions créer des styles pour toutes les balises, mais tous restent les mêmes, c'est à dire, tous les paragraphes voudrais, si nous appliquons à <td> toutes les cellules ont la couleur de fond même, si vous aviez défini, le texte même couleur ... etc etc. Nous serions condamnant les étiquettes.

, que quizás si queramos hacerlo, pero si es para una misma pagina, seguro que habrá muchos que serán básicos y ya los tendríamos en el primero y no habría necesidad de volver a crearlos. En outre, de cette manière, ne s'appliquent au document que nous créons à la fois, au cours du prochain, nous allons créer d'autres couleurs, peut-être si nous voulons, mais si, pour la même page, sûr qu'il ya beaucoup à être à la base et serait dans le premier et pas besoin de les recréer.

Donc, si elle est automatiquement appliquée, et nous enregistrer un excellent travail à la fin nous allons être très rentable ;)

Par conséquent, nous allons continuer dans le prochain tutoriel et une forme définitive que nous verrons à s'appliquer à tout un personnel d'une page Web ou tout autre document que nous avons besoin.

Répondre