Heim > Artikel > Web-Frontend > HTML-Studiennotizen 2
HTML-Studiennotizen 2
- 不言Original
- 2018-04-19 14:32:031439Durchsuche
Dieser Artikel stellt HTML-Studiennotizen 2 vor, die einen gewissen Referenzwert haben. Freunde in Not können darauf verweisen
1, Tabelleca5d30953e2ce80877f66dbd3899a325
<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>
a34de1251f0d9fe1e645927f19a896e8......fd273fcf5bcad3dfdad3c41bd81ad3e5Zeilen definieren, b6c5a531a458a2e790c1fd6421739d1c......b90dd5946f0946207856a8a37f441edfSpalten definieren
Die Kopfzeile stellt Folgendes dar:
<tr> <th>heading</th> </tr>
Wenn Sie eine Leerzeile darstellen möchten, können Sie diese mit einem Leerzeichen-Platzhalter füllen.
2. Liste
Erster Typ: Keine Sequenz Auflistung – ff6d136ddc5fdfeffaf53ff6ee95f185, verwenden Sie die fettgedruckte Punktmarkierung
<ul> <li>Coffee</li> <li>Milk</li> </ul>
oder verwenden Sie 162a8c4b77d546c61ae9ca306cde4ebb... verwendete Hohlpunkte.
Der zweite Typ: geordnete Liste – c34106e0b4e09414b63b2ea253ff83d6, verwenden Sie Nummern-Tags
<ol> <li>Coffee</li> <li>Milk</li> </ol>
Oder verwenden Sie 1f440b6628a2ecdeba8d7a6562e2d7a9..., um anzugeben, dass die Zahl bei 50 beginnt.
Dritter Typ: Benutzerdefinierte Liste – 5c69336ffbc20d23018e48b396cdd57a
<dl> <dt>Coffee</dt> <dd>Black hot drink</dd> <dt>Milk</dt> <dd>White cold drink</dd> </dl>
Erklärung:
5c69336ffbc20d23018e48b396cdd57a gibt den Anfang der Liste an
73de882deff7a050a357292d0a1fca94 stellt das Listenelement dar
67bc4f89d416b0b8236eaa5f43dee742 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>
e388a4556c0f65e1904146cc1a846bee ist ein Element auf Blockebene, das zum Festlegen derselben Klasse verwendet wird.
45a2772a6b6107b401db3c9b82c049c2
<html>
<head>
<style>
span.red {color:red;}
</style>
</head>
<body>
<h1>My <span class="red">Important</span> Heading</h1>
</body>
</html>4. HTML-Website-Layout
(1) Verwenden Sie e388a4556c0f65e1904146cc1a846bee
<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>mit 4786dff7ee6470928194244baf979f1e......94b3e26ee717c64999d7867364b1b4a3
( 2) Die von HTML5 bereitgestellten neuen semantischen Elemente
1aa9e5d373740b65a0cc8f0a02150c53 definieren den Header des Dokuments oder Abschnitts
c787b9a589a3ece771e842a6176cf8e9 Definieren Sie einen Container für Navigationslinks
c0aa3cf4895f74092c771fac967496a8 Definieren Sie einen Abschnitt im Dokument
23c3de37f2f9ebcb477c4a90aac6fffd Definieren Sie einen eigenständigen Artikel
15221ee8cba27fc1d7a26c47a001eb9b (? Immer noch nicht sicher, was das ist)
a3118e67e254c6ee72ecc4804938e0ba Definieren Sie die Fußzeile des Dokuments oder Abschnitts
a5e9d42b316b6d06c62de0deffc36939 Definieren Sie zusätzliche Details
631fb227578dfffda61e1fa4d04b7d25 Definieren Sie den Titel des Detailelements
5. Frames
Durch die Verwendung von Frames können Sie mehr als eine Seite im selben Browserfenster anzeigen. Jedes HTML-Dokument wird zu einem Frame, und jeder Frame ist unabhängig von anderen Frames.
(1) Frame-Struktur-Tag f900b4fc197b16ab214eecf015bb6bd2
Jedes f900b4fc197b16ab214eecf015bb6bd2 definiert eine Reihe von Spalten Zeilen und Spalten
Der Wert von Zeilen/Spalten gibt den Bereich des Bildschirms an, der von jeder Zeile oder Spalte eingenommen wird
<frameset cols="25%,75%"> <frame src="frame_a.htm"> <frame src="frame_b.htm"> </frameset>
(2) Andere
Im Allgemeinen hat ein Rahmen einen sichtbaren Rand, und der Benutzer kann den Rand ziehen, um seine Größe zu ändern. Wenn Sie dies vermeiden möchten, können Sie noresize="noresize" zu 04a0d55efbbfd646a993fbc01f262c57 hinzufügen.
Sie können das 6c04bd5ca3fcae76e30b72ad730ca86d-Tag nicht gleichzeitig verwenden. Wenn Sie jedoch ein 37f861bd36cef5b6406eba87d20a5bab-Tag hinzufügen, das einen Text enthält, muss der Text innerhalb des 6c04bd5ca3fcae76e30b72ad730ca86d-Tags verschachtelt sein. Das Namensankerattribut kann in
<html> <frameset cols="25%,50%,25%"> <frame src="/example/html/frame_a.html"> <frame src="/example/html/frame_b.html"> <frame src="/example/html/frame_c.html"> <noframes> <body>您的浏览器无法处理框架！</body> </noframes> </frameset> </html>
04a0d55efbbfd646a993fbc01f262c57 verwendet werden, um zum angegebenen Abschnitt zu springen.
d5ba1642137c3f32f4f4493ae923989c Wird zum Anzeigen von Webseiten innerhalb von Webseiten verwendet
Verwendung: 803a794cbe885465c190061dcc2b034d065276f04003e4622c4fe6b64f465b88
iframe可用作链接的目标（target），该链接的target属性必须引用iframe的name属性。
<iframe src="demo_iframe.htm" name="iframe_a"></iframe> <p><a href="http://www.w3school.com.cn" target="iframe_a">W3School.com.cn</a></p>
注意，由于链接的目标匹配iframe的名称，所以链接会在iframe中打开。
相关推荐：
Das obige ist der detaillierte Inhalt vonHTML-Studiennotizen 2. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!