Xiaoqiang の HTML5 モバイル開発への道 (1) - HTML 入門-H5 チュートリアル-php.cn

Xiaoqiang の HTML5 モバイル開発への道 (1) - HTML 入門

黄舟

リリース： 2017-01-22 10:17:25

オリジナル

1351 人が閲覧しました

HTMLとはHyperText Markup Language（ハイパーテキスト・マークアップ・ランゲージ）の略称で、すべてのWebページの基本構造を構成するテキストとタグの組み合わせです。

1.現在市場で人気のあるブラウザ

IE/Chrome/firefox/opera

Xiaoqiang の HTML5 モバイル開発への道 (1) - HTML 入門

その中で、Chrome/firefox/operaとIE 9/10はすべてHTML5

2と非常に互換性があります。 HTML タグ

html タグはすべて「」括弧で終わります

一般的に使用される属性は次のとおりです: id、class、style、title

id: この属性は、label が指すオブジェクトの名前を提供します

class: この属性は、オブジェクトのクラス名を提供します

style: この属性は、対応するオブジェクトの CSS スタイル

title: オブジェクトにタイトルを付けます。マウスがその上を通過すると、ほとんどのブラウザーでプロンプトが表示されます。

以降の Android 開発ではタグを使用します。これも私たちのものです。 . helloword.

<html>  
    <head>  
        <title>first html</title>  
<!--refresh:刷新-->  
        <meta http-equiv="refresh" content="1;url=http://blog.csdn.net/dawanganban&#39;">  
<!-- 表示每隔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. 重要なマーク

(1) リンク

target=" _black": リンクを新しいウィンドウで開きます

target="_selt": デフォルト値、現在のウィンドウで開きます

(2) 画像リンク

<a href="地址" border="0"><img  src="test.jpg" alt="Xiaoqiang の HTML5 モバイル開発への道 (1) - HTML 入門" ></a>

ログイン後にコピー

border 属性値: デフォルトのボーダーを削除するため。

(3) メール送信

<a href="mailto:739299362@qq.com?subject=hello">发邮件</a>
 （4）锚点（在同一页面进行跳转）
<a name="top">跳到这里</a>
<a href="#top">跳到top</a>

ログイン後にコピー

(5) テーブル

<table border="1" width="60%" cellpadding="10" cellspacing="0">
<tr><td>表格一</td><td>表格二</td></tr><tr><td>BIAOGE</td><td>BIAOGE</td></tr>
</table>

ログイン後にコピー

テーブルの配置

align 属性: 水平配置。値: left (デフォルト): left/rignt/center

valign 属性: 垂直方向の配置。値: 上/下 (デフォルト)/中央

不規則なテーブル
colspan 属性: 水平セルを結合 (列を結合)
rowspan 属性: 垂直セルを結合 (行を結合)
テーブルはネスト可能
テーブルの完全な定義

<table>
<caption>主题</caption>   只能是0个或者1个
<thead>表头</thead>       只能是0个或者1个
<tfoot>表脚</tfoot>
<tbody>表体</tbody>
</table>

ログイン後にコピー

( 6) フォーム

<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标记

ログイン後にコピー

ドロップダウンリスト:

<select name="city" multiple="multiple">
<option value="bj">北京</option>
<option value="wh">武汉</option>
<option value="nj">南京</option>
</select>
<!--加上mutiple属性就成为多选了-->

ログイン後にコピー

複数行テキスト入力ボックス:

<textarea name="desc" cols="" rows=""></textarea>

ログイン後にコピー

(7) リスト

順序なしリスト:

<ul>
<li>item1</li>
<li>item2</li>
</ul>

ログイン後にコピー

順序付きリスト:

<ol>
<li>item1</li>
<li>item2</li>
<ol>

ログイン後にコピー

( 8) 関数フレーム

は、大きなウィンドウを多数のサブウィンドウに分割することです

<frameset rows="200,300,*">  <!--划分为三个窗口-->
<frameset rows="20%,*">  <!--按照百分比划分-->
<frame src="top.html"/>
<frameset cols="30%,*"/>
<frame src="left.html"/>
<frame src="right.html"/>
</frameset>
</frameset>
<iframe>

ログイン後にコピー

その機能は、現在のウィンドウにサブウィンドウを埋め込むことです

<iframe src="some.html" width="" height="">
</iframe>

ログイン後にコピー

上記はXiaoqiangのHTML5モバイル開発パスです( 1 )——HTML の紹介コンテンツ。その他の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) に注目してください。