Heim >Web-Frontend >H5-Tutorial >Xiaoqiangs Weg zur mobilen HTML5-Entwicklung (1) – Einführung in HTML
HTML ist die Abkürzung für HyperText Markup Language, eine Kombination aus Text und Tags, die die Grundstruktur aller Webseiten bilden.
1. Beliebte Browser, die derzeit auf dem Markt sind
IE/Chrome/Firefox/Opera
Chrome/Firefox/Opera und IE 9/10 sind alle sehr kompatibel mit HTML5
2. HTML-Tags
HTML-Tags beginnen alle mit „“ Klammern enden
Häufig verwendete Attribute sind: ID, Klasse, Stil, Titel
id: Dieses Attribut stellt einen Namen für das Objekt bereit, auf das die Bezeichnung zeigt
class: Dieses Attribut stellt einen Klassennamen für das Objekt bereit
style: Dieses Attribut wendet ein entsprechendes CSS an Stil
Titel: Geben Sie dem Objekt einen Titel, den die meisten Browser auffordern, wenn die Maus darüber fährt.
Wir werden den -Tag in der nachfolgenden Android-Entwicklung verwenden. , ist auch unser Hallowort.
<html> <head> <title>first html</title> <!--refresh:刷新--> <meta http-equiv="refresh" content="1;url=http://blog.csdn.net/dawanganban'"> <!-- 表示每隔1秒向url地址刷新 --> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <!--引入一个样式文件--> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> hello word <body> </html>
3. Wichtige Markierungen
(1) Link
target="_black": Öffne den Link in einem neuen Fenster
target="_selt": Standardwert, im aktuellen Open
im Fenster (2) Bildlink
<a href="地址" border="0"><img src="test.jpg" alt="Xiaoqiangs Weg zur mobilen HTML5-Entwicklung (1) – Einführung in HTML" ></a>
Rahmenattributwert: Um den Standardrahmen zu entfernen.
(3) E-Mail senden
<a href="mailto:739299362@qq.com?subject=hello">发邮件</a> (4)锚点(在同一页面进行跳转) <a name="top">跳到这里</a> <a href="#top">跳到top</a>
(5) Tabelle
<table border="1" width="60%" cellpadding="10" cellspacing="0"> <tr><td>表格一</td><td>表格二</td></tr><tr><td>BIAOGE</td><td>BIAOGE</td></tr> </table>
Ausrichtung der Tabelle
Alignment-Attribut: horizontale Ausrichtung. Wert: left (Standard): left/rignt/center
valign-Attribut: vertikale Ausrichtung. Wert: oben/unten (Standard)/Mitte
Unregelmäßige Tabelle
Colspan-Attribut: Horizontale Zellen zusammenführen (Spalten zusammenführen)
Rowspan-Attribut: Vertikale Zellen zusammenführen (Zeilen zusammenführen)
Tabelle Kann verschachtelt werden
Vollständige Definition der Tabelle
<table> <caption>主题</caption> 只能是0个或者1个 <thead>表头</thead> 只能是0个或者1个 <tfoot>表脚</tfoot> <tbody>表体</tbody> </table>
(6) Formular
<form action="服务器端的一个程序" method="get/post"> <!--input标记--> <!--非input标记--> </form> 1)input标记: 文本输入框:<input type="text" name="username" value="缺省值"/><!--必须加name--> 提交按钮: <input type="submit" value="确认"/> 密码输入框:<input type="password" name="pwd"/> <!--必须加name--> 单选:<input type="radio" name="gender" value="m"/><!--必须加name和value--> <!--同一组name必须相同--> 多选:<input type="checkbox" name="interest" value="fishing"/> 重置:<input type="reset" value="取消"/> 普通按钮:<input type="button" value="点我吧"/> 上传文件:<input type="file" name="file1"/> 隐藏域:<input type="hidden" name="userId" value="123"> 2)非input标记
Dropdown-Liste:
<select name="city" multiple="multiple"> <option value="bj">北京</option> <option value="wh">武汉</option> <option value="nj">南京</option> </select> <!--加上mutiple属性就成为多选了-->
Mehrzeilig Texteingabefeld:
<textarea name="desc" cols="" rows=""></textarea>
(7) Liste
Ungeordnete Liste:
<ul> <li>item1</li> <li>item2</li> </ul>
Geordnete Liste:
<ol> <li>item1</li> <li>item2</li> <ol>
(8) Frame