Quels types de propriétés CSS existe-t-il ?

css属性类型有：1、html标签；2、CSS文字属性；3、CSS符号属性；4、CSS背景样式；5、CSS表单运用；6、CSS边界样式。

本教程操作环境：windows7系统、css3版，DELL G3电脑。

css属性类型有：

一、html标签

• e03b848252eb9375d56be284e690e873...bc5574f69a0cba105bc93bd3dc13c4ec文字格式化

• dc6dce4a544fdca2df29d5ac0ea9906b......16b28748ea4df4d9c2150843fecfba68Conteneur de bloc de colonnes

• Changement de taille de police6204e19e0330f923081a4c16d4055266Le mot que vous souhaitez saisire6e38b3c62e8df885fe2e3986461aa63

• Couleur de police f3a4c98eff4f3c6be42a23567f866410Le mot que vous souhaitez saisire6e38b3c62e8df885fe2e3986461aa63

• La police devient grassea4b561c25d9afb9ac8dc4d70affff419Le mot que vous souhaitez saisirb4031437bf3f4c9986d0d77a7743016dLe mot que vous souhaitez saisir72ac96585ae54b6ae11f849d2649d9e6

• La police est soulignée88f336217b3880082bb52d49b5de60a5Le mot que vous souhaitez saisir 04e11139013d3ca73accef66348e2e58

• Aligner sur la syntaxe centrale0511ef35f46864c22a06c599220d1c6fContent94b3e26ee717c64999d7867364b1b4a3

• Aligner la syntaxe à gauchea90b68a47b1014b68a00d00a43397863content94b3e26ee717c64999d7867364b1b4a3

• Aligner la syntaxe à droite211e86be24691be96dcf6c7a347bafabcontent< ;/p>

• Police barrée2e44d2d3284d23d932e1fd85f3d4cf3aLe mot que vous souhaitez saisir6cf51b1709551acbf4a696702deda05f

• Paramètre de la police =" Nom de la police">Le mot que vous souhaitez saisire6e38b3c62e8df885fe2e3986461aa63

• Police de machine à écrire78f983dbc27872ba42409adefe5049d9Le mot que vous souhaitez saisird98ca7951c814b9263d12f482df06c69

• Mot en exposant13e550ca6b50989d0d493067389d357c

• Mot d'indiceb96cac025db4031319c29e1eb68f19d6Le mot que vous souhaitez saisir270ea406e83044e5b95e23270c35ff95

• Ligne horizontale7066f81884652dc8592b2fa2a7556360

• Enroulez la ligne et saisissez le mot que vous souhaitez saisir0c6dc11e160d3b678d68754cc175188aLe mot que vous souhaitez saisir

• Lien hypertexte6c572846dfdb75d276431882536891efLe nom du lien5db79b134e9f6b82c0b36e0489ee08ed

• c39acda08ca659dc740aea0439b614d6Tapez les mots que vous souhaitez afficher ici5db79b134e9f6b82c0b36e0489ee08edÉtiquette Webmail

• Image7e83f5d2f6e384f381f539a4aabf6aa7

• Marquee (boucle) 207e674a51a625de79a64c6b5771913bMots que vous souhaitez saisir7204e33a7a23f6efcc788532e245c31b

Balise de format d'importation de fichier externe

Format d'import externe CSS :

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

Référence directe :

<style type="text/css">
<!--
id{...}
-->
</style>

javascript - Charger le fichier indépendant .js externe :

<script type="text/javascript" src="/script.js"></script>

2. Attributs de texte CSS :

color : #999999; /*text color*/

font-family : 宋体,sans-serif; -size : 9pt; /*Taille du texte*/

font-style:itelic; /*Texte italique*/

font-variant:small-caps; 🎜>

espacement des lettres : 1 pt ; /*Distance entre les mots*/

hauteur de la ligne : 200 % ; /*Définir la hauteur de la ligne*/

police -poids : gras ; /*Texte en gras*/

vertical-align:sub; /*Subscript*/

vertical-align:super /*Superscript*/

text-decoration : line-through; /*Ajouter un barré*/

text-decoration:overline; /*Ajouter une ligne supérieure*/

text-decoration: underline; 🎜>text-decoration:none; /*remove link underline*/

text-transform : majuscule; /*capitaliser le premier mot*/

text-transform : majuscule /*anglais; majuscule*/

text-transform : minuscule; /*Anglais minuscule*/

text-align:right /*Texte aligné à droite* /

text-align; :left; /*Text-align left*/

text-align:center; /*Text-align:center*/

text-align:justify ;

attribut vertical-align

vertical-align:top; /*Aligner verticalement vers le haut*/

vertical-align:bottom; >

vertical-align:middle; /*Aligner verticalement au centre*/

vertical-align:text-top; /*Aligner le texte verticalement vers le haut*/

vertical-align:text -bottom; /*Aligner le texte verticalement vers le bas*/

3. Attributs du symbole CSS :

list-style-type:aucun; *Aucun numéro*/

list-style-type:decimal; /*Chiffres arabes*/

list-style-type:lower-roman /*Chiffres romains minuscules*/

list-style-type:upper-roman; /*Chiffres romains majuscules*/

list-style-type:lower-alpha /*Lettres anglaises minuscules*/

list-style-type:upper-alpha; /*Lettres anglaises majuscules*/

list-style-type:disc /*Symbole de cercle plein*/

list-style-type : circle; /*Symbole de cercle creux*/

list-style-type:square; /*Symbole carré plein*/

list- style-image:url(/dot.gif); /*Symbole d'image*/

list-style-position:outside /*Ligne convexe*/

list-style-position :inside /*Indent*/

4. Style d'arrière-plan CSS :

couleur d'arrière-plan : #F5E2EC ; Arrière-plan en perspective*/

background-image : url(/image/bg.gif); /*Image d'arrière-plan*/

background-attachment : corrigé /*Filigrane d'arrière-plan fixe*/

background-repeat : répéter; /*Répéter l'arrangement - page Web par défaut*/

background-repeat : no-repeat; / *Ne pas répéter l'arrangement*/

background-repeat : répéter-x; /*Répéter la disposition sur l'axe des x*/

background-repeat : répéter-y /*Répéter la disposition sur l'axe des y */

Spécifiez la position de l'arrière-plan

background-position : 90% 90% /*La position des axes x et y de l'image d'arrière-plan*/

background -position : top; /*Align up*/

background-position : bottom; /*Align down*/

background-position : left /*Align left*/

background-position : right; /*Align right*/

background-position : center; /*Align center*/

5 , propriétés de connexion CSS :

a /*Tous les hyperliens*/

a:lien /*Format du texte du lien hypertexte*/

a:visité /*Format du texte du lien consulté*/

a:active /*Format du lien pressé*/

a:hover /*Souris pour lier*/

Style du curseur de la souris :

CURSEUR de doigt de lien : main

Curseur à flèche croisée :réticule

Curseur fléché vers le bas :s-resize

Curseur à flèche croisée :déplacer

Flèche vers le curseur droit: déplacer

Ajouter un point d'interrogation curseur:aider

Flèche vers le curseur gauche:w-resize

Flèche vers le curseur vers le haut:n-resize

Flèche pointant vers le haut et vers le curseur droit : ne-resize

Flèche pointant vers le haut et vers le curseur gauche :nw-resize

Curseur de type I de texte :text

Flèche inclinée vers le bas et curseur droit :se-resize

Flèche en diagonale du curseur inférieur gauche :sw-resize

Curseur en entonnoir :attendre

Motif de curseur (IE6) p {curseur : url("cursor file name .cur"),text;}

6. Liste des bordures CSS :

border-top : 1px solide #6699cc; /* Bordure supérieure*/

bordure-bas : 1px solide #6699cc; /*Bordure inférieure*/

bordure-gauche : 1px solide #6699cc; */

border-right : 1px solid #6699cc; /*right border line*/

Ce qui précède est la méthode d'écriture recommandée, mais vous pouvez également utiliser la méthode conventionnelle comme suit :

border-top-color : #369 /*Définir la couleur supérieure de la bordure supérieure*/

border-top-width : 1px /*Définir la largeur supérieure de la bordure supérieure*/

border-top-style: solid/*Définir le style de bordure supérieure*/

Autres styles de bordure

solide /*Bordure pleine*/

pointillé /*cadre pointillé*/

double /*cadre double*/

rainure /*cadre convexe tridimensionnel*/

crête /*cadre en relief tridimensionnel*/

encart /*cadre concave*/

début /*cadre convexe*/

7. Application de formulaire CSS :

• Zone de texte1d4ff764ff0bebd2953d4c2fe5a65a83

• Boutonf3d13a9c5caf587679bbba9fb5e03574

• case à cocher33019624ac828fc4a80c7e5fca747947

• Bouton de sélectionacf62712694e1cb5f53df8e703a1c6de

• Multi -zone de texte en ligne< ;textarea rows="1" name="S1" cols="15">40587128eee8df8f03d0b607fe983014

• Menu déroulanta70f0e012759a8524f576715b8b26c735a07473c87748fb1bf73f23d45547ab8Option 14afa15d3069109ac30911f04c56f3338

  5a07473c87748fb1bf73f23d45547ab8Option 24afa15d3069109ac30911f04c56f333818bb6ffaf0152bbe49cd8a3620346341

8. Style de bordure CSS :

margin-top:10px; /*bordure supérieure*/

margin-right:10px /*bordure droite; valeur*/

margin-bottom:10px; /*valeur de marge inférieure*/

margin-left:10px /*valeur de marge gauche*/

9 , bordure CSS vide :

padding-top:10px; /*Laisser la bordure supérieure vide*/

padding-right:10px; bordure droite vierge* /

padding-bottom:10px; /*Laissez la bordure inférieure vide*/

padding-left:10px /*Laissez la bordure gauche vide*/

Tutoriels associés recommandés : Tutoriel vidéo CSS

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!