Maison > interface Web > tutoriel HTML > le corps du texte

Disposition des styles par défaut des balises HTML_HTML/Xhtml_Production de pages Web

WBOY
Libérer: 2016-05-16 16:39:56
original
1230 Les gens l'ont consulté

html, adresse, blockquote, corps, dd, div, dl, dt, fieldset, formulaire, cadre, frameset, h1, h2, h3, h4, h5, h6, noframes, ol, p, ul, centre, dir, hr, menu, pre { display: block }/*Les éléments de la liste ci-dessus sont affichés sous forme de bloc par défaut, et ceux qui ne sont pas affichés seront affichés en tant qu'éléments en ligne. Cette liste est pour la version HTML4, et certains éléments seront obsolètes dans. XHTML1*/
li { display: list-item }/*La valeur par défaut est d'afficher dans une liste*/
head { display: none }/*La valeur par défaut est de ne pas afficher*/
table { display: table }/*La valeur par défaut est d'afficher dans un tableau*/
tr { display: table-row }/*La valeur par défaut est l'affichage des lignes de tableau*/
thead { display: table-header-group } /*La valeur par défaut est l'affichage du groupe d'en-tête du tableau*/
tbody { display: table-row-group }/*La valeur par défaut est l'affichage du groupe des lignes du tableau*/
tfoot { display: table-footer-group } /*La valeur par défaut est l'affichage de groupe en bas du tableau*/
col { display: table-column }/* La valeur par défaut est l'affichage des colonnes du tableau*/
colgroup { display: table-column-group } /*La valeur par défaut est l'affichage du groupe de colonnes du tableau*/

td, th { display: table-cell; }/*Affichage par défaut pour les cellules*/

caption { display: table-caption } /*Par défaut pour l'affichage du titre du tableau*/

th { font-weight: bolder; text-align: center }/ *La valeur par défaut est d'afficher le titre du tableau, en gras et centré*/
caption { text-align: center }/*La valeur par défaut est d'afficher le titre du tableau, dans un état centré*/
body { margin: 8px; line-height : 1.12 }
h1 { font-size: 2em ; marge : .67em 0 }
h2 { taille de police : 1,5em ; marge : .75em 0 }
h3 { taille de police : 1,17em ; marge : .83em 0 }
h4, p , blockquote, ul, fieldset, form, ol, dl, dir, menu { margin : 1.12em 0 }
h5 { font-size : .83em; margin : 1.5 em 0 }
h6 { font-size : .75em ; marge : 1,67em 0 }
h1, h2, h3, h4, h5, h6, b,strong { font-weight : bolder }
blockquote { margin-left : 40px margin-right : 40px ; }
i, cite, em,var, adresse { font-style : italic }
pre, tt, code, kbd, samp { font-family : monospace }
pre { espace blanc : pre }
bouton, zone de texte, entrée, objet, sélectionnez { display:inline-block; }
big { font-size: 1.17em }
small, sub , sup { font-size: .83em }
sub { vertical-align: sub }/*Définir le sous-élément à afficher par défaut*/
sup { vertical-align: super }/*Définir le sous-élément à afficher par défaut Afficher l'exposant */
table { border-spacing: 2px; }
thead, tbody, tfoot { vertical-align: middle }/*Définir les éléments d'en-tête, de corps et de pied de tableau à aligner verticalement par défaut* /
td , th { vertical-align: hériter }/*Définir les cellules et les titres de colonnes à aligner verticalement par défaut et hérités par défaut*/
s, strike, del { text-decoration: line-through }/* Définir ces éléments à afficher barré par défaut*/

hr { border: 1px inset }/* Définit la ligne de séparation comme étant un effet de bord concave 3D de 1 px de large par défaut*/

ol, ul , dir , menu, dd { margin-left: 40px }

ol { list-style-type: decimal }
ol ul, ul ol, ul ul, ol ol { margin-top : 0; margin- bottom: 0 }
u, ins { text-decoration: underline }
br:before { content: ""A" }/*Définir le style de contenu pseudo-objet de l'élément de saut de ligne*/
:before, : after { white-space: pre-line }/*Définir le style par défaut des caractères de l'espace pseudo-objet*/
center { text-align: center }
abbr, acronyme { font- variante : petites majuscules ; espacement des lettres : 0,1 em }
:link, :visited { text-decoration: underline }
:focus { outline : inversion en pointillés fins }
/* Commencer les paramètres de bidirectionnalité (faire pas de changement) */
BDO[DIR="ltr"] { direction: ltr; unicode-bidi: bidi-override }/*Définir l'ordre d'affichage de lecture et d'écriture du texte par défaut de l'élément BDO lorsque son attribut est DIR= "ltr"*/
BDO[ DIR="rtl"] { direction: rtl; unicode-bidi: bidi-override }/*Définir l'ordre d'affichage par défaut de lecture et d'écriture du texte de l'élément BDO lorsque son attribut est DIR= "rtl"*/
*[DIR= "ltr"] { direction: ltr; unicode-bidi: embed }/*Définir l'ordre d'affichage de lecture et d'écriture du texte par défaut pour tout élément lorsque son attribut est DIR="ltr" */
*[DIR="rtl"] { direction: rtl; unicode-bidi: embed }/*Définir l'ordre d'affichage par défaut de lecture et d'écriture du texte de tout élément lorsque son attribut est DIR="rtl"*/

@media print { /*Définir le style d'impression par défaut du titre et de la liste*/
h1 { saut de page-avant : toujours }
h1, h2, h3, h4, h5, h6 { page -break-after : éviter }
ul, ol, dl { page-break-before : éviter }
}

Style par défaut du navigateur

1 . Marge de la page
IE par défaut est 10px, passé Le paramètre d'attribut de marge du corps
FF est par défaut à 8px et le paramètre d'attribut de remplissage du corps
Pour effacer les marges de la page, vous devez effacer ces deux attributs. valeurs​​

Copier le code
Le code est le suivant :

corps {
marge :0 ;
remplissage :0
}

2. Espacement des paragraphes
IE est par défaut de 19px, défini par l'attribut margin-top de p
FF est par défaut de 1,12em, défini par l'attribut margin-bottom de p
p par défaut pour bloquer l'affichage. , Pour effacer l'espacement des paragraphes, vous pouvez généralement définir

Copier le code
Le code est le suivant :

p {
margin-top:0;
margin-bottom:0
}

3. affichage en gras : font-weight :bold;.
Veuillez vous référer au tableau ci-dessus pour la taille par défaut
C'est aussi écrit comme ça


Copiez le codeLe code est le suivant :
h1 {font-size:xx-large;}
h2 {font-size:x-large;}
h3 {font-size :large;}
h4 {font-size:medium;}
h5 {font-size:small;}
h6 {font-size:x-small;}

La taille de police par défaut du grand navigateur est de 16 pixels, ce qui est égal à moyen. Par défaut, les éléments h1~h6 sont affichés en gras dans la police d'affichage en bloc
Pour effacer le style du titre, vous pouvez généralement définir

.
Copier le codeLe code est le suivant :
hx {
font-weight:normal; 🎜>font-size:value;
}


4. Style de liste
IE par défaut est 40px, défini par les attributs de marge de ul et ol
FF est par défaut 40px, défini par les attributs de remplissage de ul et ol
dl n'a pas d'indentation, mais l'élément de description interne dd est indenté de 40px par défaut, tandis que l'élément de nom dt n'est pas indenté.
Pour effacer le style de liste, vous pouvez généralement définir



Copier le code Le code est le suivant :
ul, ol, dd {
list-style-type:none;/*Effacer le caractère de style de liste*/
margin-left:0;/*Effacer le retrait gauche d'IE*/
padding- left:0;/*Effacer le retrait gauche non-IE*/
}


5. Les éléments sont centrés
IE par défaut est text-align:center FF est par défaut margin -left:auto;margin-right:auto;

6. Style de lien hypertexte
un style est souligné par défaut et la couleur d'affichage est bleue. effacez le style du lien, généralement vous pouvez définir




Copiez le code
Le code est le suivant :
a {
text-decoration:none;
color:#colorname
}


7 Style de souris
IE par défaut curseur:hand FF par défaut est curseur:pointeur ;. Cette déclaration est également valable dans IE

8 Style de lien d'image
IE par défaut est une ligne de bordure violette de 2 pixels
FF est par défaut une ligne de bordure bleue de 2 pixels
Pour effacer le style de lien d'image, en général Vous pouvez définir
img {
border:0
}
Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal