html-示例代碼

本文轉載自查看原文 2017-09-17 15:39 2593 html

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="UTF-8"/>

    <meta http-equiv="refresh" content="3"/>
    <!--
    <meta http-equiv="Refresh" content="3;url=http://www.baidu.com" />
    -->
    <meta name="keywords" content="測試所有代碼"/>
    <meta name="descrtions" content="測試代碼"/>
    <meta http-equiv="x-ua-compatible" content="ie=IE9"/>
    <title>所有標簽代碼示例</title>
    <link rel="icon" href="img/favicon.ico">
    <link rel="stylesheet" href="css/common.css">
</head>
<body>
    <div id="top"></div>
    <h1>1）各種符號</h1>
        空格：&nbsp;
        大於號：&gt;
        小於號: &lt;
    <h1>2）段落換行</h1>
        <p>我家中華人民</p>
    <h1>3）h標簽</h1>
        <h1>h1</h1>
        <h2>h2</h2>
        <h3>h3</h3>
        <h4>h4</h4>
        <h5>h5</h5>
        <h5>h6</h5>
        <hr/>
    <h1>4) 行內標簽span</h1>
        <span>1111</span>
    <h1>5）a標簽</h1>
        <a href="http://www.baidu.com" target="_blank">點我跳百度</a>
        <a href="#top">頁內跳轉到頂部：錨使用</a>
    <h1>6)form表單</h1>
        <form action="baidu.com" method="get" enctype="multipart/form-data">
            <!-- 用於點擊用戶名，使得關聯的標簽獲取光標-->
            <label for="username">用戶名：</label>
             <!-- 普通輸入框，name是傳輸給后台變量名-->
            <input id="username" type="text" name="username" />
            <br/>
            <label for="password">密碼：</label>
            <input id="password" type="password" name="password" />
            <br/>
            <input type="button" value="操作鍵鈕">
            <br/>
            <!-- 單先框，name屬性(name相同則互斥) value是傳遞的值-->
            <input type="radio" name="sex" value="0">男</input>
            <input type="radio" name="sex" value="1">女</input>
            <br/>
            <!-- input type="checkbox" 復選框value,name屬性（批量獲取數據）單先框，復選框設置默認旨-->
            <input type="checkbox" name="check" checked="checked" value="1">足球</input>
            <input type="checkbox" name="check"  value="2">藍球</input>


            <br/>
             <label for="multi">多行標簽：</label>
            <textarea id="multi" name="multi"  ></textarea>
             <br/>
            <label for="select">select：</label>
            <select id="select" name="select" size="2"> <!-- 默認size=1-->
                <option value="1" selected="selected">1</option><!--默認值-->
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
            </select>
                <!--分組-->
            <br/>
            <p>分組</p>
            　<select >
　　              <optgroup label="上海">1</optgroup><!--分組名稱-->
　　              <option value="2">2</option>
                    <option value="3">3</option>
　　          </select>
            <!-- 元素組合表單中的相關數據-->
            　　<fieldset>
　　　　            <legend>登錄</legend>
　　　　            <label>用戶名</label>
                     <label>密碼</label>
　　              </fieldset>

             <input type="file" value="上傳文件">
            <input type="reset" value="重值">
             <input type="submit" value="提交">
        </form>

    <h1>7) 表格</h1>
        <table border="1">
            <caption>橫跨兩列的單元格</caption>
            <tr>
                <th>姓名</th>
                <th colspan="2">電話</th>
            </tr>
            <tr>
                <td>111</td>
                <td>222</td>
                <td>3333</td>
            </tr>
            <tr>
                <td rowspan="2">111</td>
                <td>222</td>
                <td>3333</td>
            </tr>
                    <tr>
                <td>111</td>
                <td>222</td>

            </tr>
        </table>
        <br/>
          <table border="1">
          <thead>
            <tr>
              <th>Month</th>
              <th>Savings</th>
            </tr>
          </thead>

          <tfoot>
            <tr>
              <td>Sum</td>
              <td>$180</td>
            </tr>
          </tfoot>

          <tbody>
            <tr>
              <td>January</td>
              <td>$100</td>
            </tr>
            <tr>
              <td>February</td>
              <td>$80</td>
            </tr>
          </tbody>
        </table>

    <h1>列表</h1>
        <h2>無序列表</h2>
        <ul>
            <li>111</li>
            <li>222</li>
        </ul>
        <h2>有序列表</h2>
        <ol>
            <li>Coffe</li>
            <li>2222</li>
        </ol>
         <h2>自定義列表</h2>
            <dl>
                <dt>11</dt><dd>black</dd>
                <dt>222</dt>
                <dd>white</dd>
            </dl>
</body>
</html>

1）各種符號

空格：大於號：> 小於號: <

2）段落換行

我家中華人民

3）h標簽

h1

h2

h3

h4

h5

h6

4) 行內標簽span

1111

5）a標簽

點我跳百度頁內跳轉到頂部：錨使用

6)form表單

用戶名：
密碼：

男女
足球藍球
多行標簽：
select：

分組

　　　　登錄　　　　用戶名密碼　　

7) 表格

橫跨兩列的單元格
姓名	電話
111	222	3333
111	222	3333
111	111	222

Month	Savings
Sum	$180
January	$100
February	$80

列表

無序列表

有序列表

Coffe
2222

自定義列表

11: black
222: white

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 HTML-第一個簡單的JavaScript代碼 HTML-滾動字幕的源代碼（可作滾動公告） HTML-簡單動畫 Html-自適應 HTML-圖片的格式 html簡單代碼示例 html-輪播圖 HTML-美化 HTML-超鏈接a標簽 html- 點擊圖片放大