Maison > interface Web > tutoriel HTML > Exemples pour introduire la connaissance du formatage du texte HTML

Exemples pour introduire la connaissance du formatage du texte HTML

小云云
Libérer: 2017-12-11 11:28:46
original
1732 Les gens l'ont consulté

Cet article vous apporte un exemple simple (explication détaillée) de formatage de texte HTML. J'espère qu'après avoir appris cela, tout le monde sera capable de maîtriser les connaissances sur le formatage du texte HTML et de mieux l'utiliser.

1. Formatage du texte : cet exemple montre comment formater le texte dans un fichier HTML.

<html>
<body>
<b>This text is bold</b>
<br />
<strong>This text is strong</strong>
<br />
<big>This text is big</big>
<br />
<em>This text is emphasized</em>
<br />
<i>This text is italic</i>
<br />
<small>This text is small</small>
<br />
This text contains   
<sub>subscript</sub>
<br />
This text contains   
<sup>superscript</sup>
</body>
</html>
Copier après la connexion



L'effet est le suivant :

2. Texte préformaté : cet exemple montre comment utiliser la balise pre pour contrôler les lignes vides et les espaces.


<html>
<body>
<pre class="brush:php;toolbar:false">
这是   
预格式文本。   
它保留了      空格   
和换行。   

pre 标签很适合显示计算机代码:

for i = 1 to 10   
     print i   
next i   
Copier après la connexion



L'effet est le suivant :

3. Étiquette « Sortie ordinateur » : Cet exemple montre les effets d'affichage de différentes étiquettes « Sortie ordinateur ».

<html>
<body>
<code>Computer code</code>
<br />
<kbd>Keyboard input</kbd>
<br />
<tt>Teletype text</tt>
<br />
<samp>Sample text</samp>
<br />
<var>Computer variable</var>
<br />
<p>
<b>注释:</b>这些标签常用于显示计算机/编程代码。   
</p>
</body>
</html>
Copier après la connexion

L'effet est le suivant :

Quatre adresses : cet exemple montre comment écrire une adresse dans un. Fichier HTML.


XML/HTML Code复制内容到剪贴板
<!DOCTYPE html>
<html>
<body>
<address>
Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.<br>
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA   
</address>
</body>
</html>
Copier après la connexion



L'effet est le suivant :

5. Abréviations et acronymes : Cet exemple montre comment implémenter des abréviations ou des acronymes.

<html>
<body>
<abbr title="etcetera">etc.</abbr>
<br />
<acronym title="World Wide Web">WWW</acronym>
<p>在某些浏览器中,当您把鼠标移至缩略词语上时,title 可用于展示表达的完整版本。</p>
<p>仅对于 IE 5 中的 acronym 元素有效。</p>
<p>对于 Netscape 6.2 中的 abbr 和 acronym 元素都有效。</p>
</body>
</html>
Copier après la connexion



L'effet est le suivant :

6. Direction du texte : cet exemple montre comment changer la direction du texte.

<html>
<body>
<p>
如果您的浏览器支持 bi-directional override (bdo),下一行会从右向左输出 (rtl);   
</p>
<bdo dir="rtl">
Here is some Hebrew text   
</bdo>
</body>
</html>
Copier après la connexion



L'effet est le suivant :

7. Citation en bloc : Cet exemple montre comment implémenter des citations de différentes longueurs.

<html>
<body>
这是长的引用:   
<blockquote>
这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。   
</blockquote>
这是短的引用:   
<q>
这是短的引用。   
</q>
<p>
使用 blockquote 元素的话,浏览器会插入换行和外边距,而 q 元素不会有任何特殊的呈现。   
</p>
</body>
</html>
Copier après la connexion

L'effet est le suivant :

Huit, supprimer les sous-effets et insérer des sous-effets.

<html>
<body>
<p>一打有 <del>二十</del> <ins>十二</ins> 件。</p>
<p>大多数浏览器会改写为删除文本和下划线文本。</p>
<p>一些老式的浏览器会把删除文本和下划线文本显示为普通文本。</p>
</body>
</html>
Copier après la connexion



L'effet est le suivant :

Avez-vous appris à frapper ? Dépêchez-vous et essayez-le vous-même.

Recommandations associées :

Titre HTML récapitulatif, paragraphe, saut de ligne, ligne horizontale, caractère spécial

La mise en œuvre HTML est Boîte d'invite simple

Comment choisir la balise HTML appropriée

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!

É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