简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Maison > interface Web > tutoriel HTML > le corps du texte

Notes d'étude HTML 2

不言
Libérer： 2018-04-19 14:32:03
original
1445 Les gens l'ont consulté


Cet article présente les notes d'étude HTML 2, qui ont une certaine valeur de référence. Je les partage avec vous maintenant. Les amis dans le besoin peuvent s'y référer

1 , tableau< table>

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Copier après la connexion

......définir des lignes, ......définir des colonnes

L'en-tête représente : 

<tr>
<th>heading</th>
</tr>
Copier après la connexion

Si vous souhaitez représenter une ligne vide, vous pouvez la remplir avec un espace réservé  space.


2. Liste



Premier type : Aucune Séquence Liste -

    , utilisez des points gras 

    <ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
    Copier après la connexion


    ou utilisez

      ... utilisé des points creux.


      Le deuxième type : liste ordonnée -

        , utilisez des balises numériques 

        <ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
        Copier après la connexion


        Ou utilisez

          ... pour indiquer que le nombre commence à 50.




          Troisième type : Liste personnalisée - 

          <dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
          Copier après la connexion


          Explication :

          indique le début de la liste



          représente l'élément de liste

          représente la définition de l'élément de liste



          Notez que les paragraphes, les sauts de ligne, les images, les liens, d'autres listes, etc. peuvent être utilisés à l'intérieur des éléments de liste.




          3. Classe HTML

          classe le HTML et peut classer un élément. définit le style CSS.



          Définissez le même style pour la même classe. 

          <!DOCTYPE html>
<html>
<head>
<style>
.cities {
    background-color:black;
    color:white;
    margin:20px;
    padding:20px;
} 
</style>
</head>

<body>

<p class="cities">
<h2>London</h2>
<p>
London is the capital city of England. 
It is the most populous city in the United Kingdom, 
with a metropolitan area of over 13 million inhabitants.
</p>
</p> 

</body>
</html>
          Copier après la connexion



          est un élément de niveau bloc utilisé pour définir la même classe.

          est un élément en ligne. 

          <html>
<head>
<style>
  span.red {color:red;}
</style>
</head>
<body>

<h1>My <span class="red">Important</span> Heading</h1>

</body>
</html>
          Copier après la connexion



          4. Mise en page du site Web HTML

          (1) Utilisez 


          <head>
<style>
#header {
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;
}
#nav {
    line-height:30px;
    background-color:#eeeeee;
    height:300px;
    width:100px;
    float:left;
    padding:5px;	      
}
#section {
    width:350px;
    float:left;
    padding:10px;	 	 
}
#footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
   padding:5px;	 	 
}
</style>
</head>
          Copier après la connexion


          en utilisant

          (2) Le nouveaux éléments sémantiques fournis par HTML5



          définissent l'en-tête du document ou de la section