HTML-Studiennotizen 2

不言
Freigeben: 2018-04-19 14:32:03
Original
1446 Leute haben es durchsucht


Dieser Artikel stellt HTML-Studiennotizen 2 vor, die einen gewissen Referenzwert haben. Freunde in Not können darauf verweisen

1, Tabelle< Tabelle>

<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>
Nach dem Login kopieren

......Zeilen definieren, ......Spalten definieren

Die Kopfzeile stellt Folgendes dar:

<tr>
<th>heading</th>
</tr>
Nach dem Login kopieren

Wenn Sie eine Leerzeile darstellen möchten, können Sie diese mit einem  Leerzeichen-Platzhalter füllen.


2. Liste



Erster Typ: Keine Sequenz Auflistung –

    , verwenden Sie die fettgedruckte Punktmarkierung

    <ul>
    <li>Coffee</li>
    <li>Milk</li>
    </ul>
    Nach dem Login kopieren


    oder verwenden Sie

      ... verwendete Hohlpunkte.


      Der zweite Typ: geordnete Liste –

        , verwenden Sie Nummern-Tags

        <ol>
        <li>Coffee</li>
        <li>Milk</li>
        </ol>
        Nach dem Login kopieren


        Oder verwenden Sie

          ..., um anzugeben, dass die Zahl bei 50 beginnt.




          Dritter Typ: Benutzerdefinierte Liste –

          <dl>
          <dt>Coffee</dt>
          <dd>Black hot drink</dd>
          <dt>Milk</dt>
          <dd>White cold drink</dd>
          </dl>
          Nach dem Login kopieren


          Erklärung:

          gibt den Anfang der Liste an



          stellt das Listenelement dar

          stellt die Definition des Listenelements dar



          Beachten Sie, dass Absätze, Zeilenumbrüche, Bilder, Links, andere Listen usw. innerhalb von Listenelementen verwendet werden können.




          3. HTML-Klasse

          klassifiziert HTML und kann die Klasse eines Elements sein definiert den CSS-Stil.



          Legen Sie den gleichen Stil für die gleiche Klasse fest.

          <!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>
          Nach dem Login kopieren



          ist ein Element auf Blockebene, das zum Festlegen derselben Klasse verwendet wird.


          <html>
          <head>
          <style>
            span.red {color:red;}
          </style>
          </head>
          <body>
          
          <h1>My <span class="red">Important</span> Heading</h1>
          
          </body>
          </html>
          Nach dem Login kopieren



          4. HTML-Website-Layout

          (1) Verwenden Sie


          <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>
          Nach dem Login kopieren


          mit

          ( 2) Die von HTML5 bereitgestellten neuen semantischen Elemente



          definieren den Header des Dokuments oder Abschnitts