国产无码综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

<font id="jr1qp"><rp id="jr1qp"><thead id="jr1qp"></thead></rp></font>

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

2年前作者：Pireley分類：Toy博客閱讀(19)違法舉報

這篇具有很好參考價值的文章主要介紹了前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例。希望對大家有所幫助。如果存在錯誤或未考慮完全的地方，請大家不吝賜教，您也可以點(diǎn)擊"舉報違法"按鈕提交疑問。

引出

html是啥，常見的標(biāo)簽，幾個例子

一、概述

1.1 HTML是什么？

Hyper Text Markup Language (超文本標(biāo)記語言) 簡寫:HTML，HTML 通過標(biāo)簽來標(biāo)記要顯示的網(wǎng)頁中的各個部分。網(wǎng)頁文件本身是一種文本文件，通過在文本文件中添加標(biāo)記符，可以告訴瀏覽器如何顯示其中的內(nèi)容(如:文字如何處理，畫面如何安排，圖片如何顯示等)

1.2 網(wǎng)頁的組成部分

頁面由三部分內(nèi)容組成，

分別是內(nèi)容(結(jié)構(gòu))、表現(xiàn)、行為。

內(nèi)容(結(jié)構(gòu))，是在頁面中可以看到的數(shù)據(jù)。稱之為內(nèi)容。一般內(nèi)容使用 html 技術(shù)來展示。

表現(xiàn)，指的是這些內(nèi)容在頁面上的展示形式。比如。布局，顏色，大小等等。一般使用 CSS 技術(shù)實(shí)現(xiàn)

行為，指的是頁面中元素與輸入設(shè)備交互的響應(yīng)。一般使用 javascript 技術(shù)實(shí)現(xiàn)。

示例：

x <button type="button" style="background: #7ED321;width: 80px;height: 40px;color: #ffffff" onclick="alert('題目還未答完')">提交答案</button>

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

1.3 頁面中的元素

文字顯示，圖片，按鈕，輸入框
前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例
輸入框，多選框，下拉框

表格，多選框，按鈕

二、創(chuàng)建HTML文件

寫html用一般的文字編輯器都可以，也可以使用專業(yè)的工具，Hbuilder,webstorm ,VScode等；

和Java文件的區(qū)別：
1.Java文件需要先編譯，再通過Java虛擬機(jī)運(yùn)行；
2.HTML文件不需要編譯，直接由瀏覽器進(jìn)行解析；

三、HTML骨架

html 表示整個文檔
head 管理頭的部分，包括title和編碼
title 整個網(wǎng)頁的標(biāo)題，會顯示在瀏覽器的上面
body 身體的部分，未來要顯示的標(biāo)簽都在<body></body>中間

<!DOCTYPE html><!--約束  申明 -->
<html lang="zh_CN"><!--html的開始，包括head body lang表示用的語言 -->
<head><!--表示頭 一般包括title css js  -->
    <meta charset="UTF-8"><!--當(dāng)前頁面的編碼 -->
    <title>Title</title><!--標(biāo)題 -->
</head>
<body><!--html的正文內(nèi)容 -->
hello 你好
<!-- 注釋-->
</body>
</html>

**Html 的代碼注釋 <!-- 這是 html 注釋，可以在頁面右鍵查看源代碼中看到 -->**

可以使用和eclipse一樣的快捷鍵，用ctrl+/來注釋一段代碼

html文件都是.html或.htm結(jié)尾

四、常用的標(biāo)簽

完整的標(biāo)簽可以參考w3c網(wǎng)站

W3c網(wǎng)站

4.1 排版標(biāo)簽

h1~h6 做標(biāo)題使用，特點(diǎn)：
1.獨(dú)占一行；
2.行間有空隙；
3.加粗
p 段落；<hr 分割線

<!DOCTYPE html>
<html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>你好呀！</title>
    </head>

    <body>
    你好呀，哈哈哈，中國
<!--    做標(biāo)題使用，特點(diǎn)：
          1.獨(dú)占一行；
          2.行間有空隙；
          3.加粗
-->
    <h1>一級標(biāo)題</h1>
    <h2>二級標(biāo)題</h2>
    <h3>三級標(biāo)題</h3>
    <h4>四級標(biāo)題</h4>
    <h5>五級標(biāo)題</h5>
    <h6>六級標(biāo)題</h6>

    <p>
        具有良好的溝通能力與團(tuán)隊合作能力；性格開朗，勇于挑戰(zhàn)；良好的人際關(guān)系，對技術(shù)有更高的追求。
    </p>

    test
    <br>
    test

    分割線<hr>

    </body>
</html>

4.1 排版案例

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

<!DOCTYPE html>
<html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>排版</title>
    </head>
    <body>
<!--    h1標(biāo)題，獨(dú)占一行，加粗，段前段后間距-->
    <h1>抬手就能付款！掌紋信息交出去了安全嗎？</h1>
<!--    hr 一條橫線 -->
    <hr>
    來源：揚(yáng)子晚報 | 2023年05月24日 10:39:46
    原標(biāo)題：抬手就能付款！掌紋信息交出去了安全嗎？
    <hr>
<!--    p 段落-->
<!--    &nbsp;縮進(jìn)的非正規(guī)寫法-->
<!--    <br>換行-->
    <p>
      &nbsp;&nbsp;&nbsp;出門不用帶手機(jī)、銀行卡，抬抬手就能付款！5月21日，<br>微信宣布“刷掌支付”功能上線，用戶目前可以在北京實(shí)現(xiàn)刷掌坐地鐵。對此，<br>有網(wǎng)友調(diào)侃道：“揮手說我不要，然后就把錢扣走了”“有些手，<br>刷著刷著錢就沒了”，也有人表示擔(dān)心，從此又多了一個個人信息泄露隱患。
    </p>

    <p>
      據(jù)微信官方消息，用戶需要先在設(shè)備綁定個人微信賬號，錄入手掌紋樣。消費(fèi)時，將手掌對準(zhǔn)支付設(shè)備的掃描區(qū)，確認(rèn)后即可完成支付。相比刷臉支付，刷掌支付無論是安全或精準(zhǔn)度上都更高一些。區(qū)別于指紋識別讀取指腹的表皮紋路，掌紋讀取的則是掌心血管紋路，能夠避免暴露在外以及復(fù)制偽造。
    </p>

<!-- <b> 加粗-->
    <b>據(jù)微信官方消息</b><br>
<!-- <i> 斜體-->
    <i>據(jù)微信官方消息</i><br>
<!-- <u> 下劃線-->
    <u>據(jù)微信官方消息</u><br>
<!-- <s>  刪除-->
    <s>據(jù)微信官方消息</s><br><br>

    浙江溫州江南皮革廠倒閉了，<b><s>100塊</s></b>，200塊，300塊的皮包，統(tǒng)統(tǒng)只用<b><i><u>15塊</u></i></b>


    </body>
</html>

4.2 圖片【重點(diǎn)】

[1] 圖片看成一個對象，屬性
1.src指向什么地方,源頭；網(wǎng)絡(luò)或者本地【需要在當(dāng)面目錄】
2.寬和高，width=，等比例縮小
3.title 央視鼠標(biāo)移動上去的效果
4.border 邊框，棄用
5.alt 只有圖片找不到時候才會顯示

[2] 相對路徑和絕對路徑

j2se中相對路徑：從工程名開始

? 絕對路徑：/user/download/1.jpg

Web中的相對路徑：

? . 表示當(dāng)前文件所在的目錄，如果文件在同一目錄，./可以省略不寫

? …表示當(dāng)前文件所在的上一級目錄

絕對路徑：https://hanyu-word-gif.cdn.bcebos.com/b22108502548d479dbab406e2d7657ab2.gif

<img src="1.gif" height="200" width="200" border="20" alt="牛被吹飛了"/>
<img src="./1.gif" height="200" width="200" border="20" alt="牛被吹飛了"/>
<img src="../imgs/1.gif" height="200" width="200" border="20" alt="牛被吹飛了"/>

4.2 圖片案例（音視頻）

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>

    <body>
<!--    圖片看成一個對象，屬性
    1.src指向什么地方,源頭；網(wǎng)絡(luò)或者本地【需要在當(dāng)面目錄】
    2.寬和高，width=，等比例縮小
    3.title 央視 鼠標(biāo)移動上去的效果
    4.border 邊框，棄用
    5.alt 只有圖片找不到時候才會顯示-->
    <img alt="我是央視圖片" border="1" title="哈哈哈" width="200px" src="https://p1.img.cctvpic.com/photoAlbum/templet/common/DEPA1565315968922641/yangshiwang_logo_18897_190809.png">
    <br>
<!-- ../ 表示出上一級目錄，如果再上一級，../../ -->
    <img width="400px" src="../img/微信圖片_20220312230228.jpg">

    <br>
<!-- 從項(xiàng)目路徑開始 找 -->
    <img width="400px" src="/html0601/img/微信圖片_20220312230228.jpg">

    </body>
</html>

音頻、視頻
音頻，controls 顯示控制，autoplay自動播放，loop 循環(huán)播放
視頻，controls 顯示控制，autoplay不起作用被禁用【瀏覽器】，loop 循環(huán)播放

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>

    <body>
    <img width="400px" src="img/微信圖片_20220312230228.jpg">
    <br>
<!--    音頻，controls 顯示控制，autoplay自動播放，loop 循環(huán)播放-->
    <audio src="mp3/niu2.mp3" controls autoplay></audio>

<!--    視頻，controls 顯示控制，autoplay不起作用被禁用【瀏覽器】，loop 循環(huán)播放-->
    <video ></video>

    <audio src="https://hanyu-word-pinyin-short.cdn.bcebos.com/niu2.mp3" controls></audio>

    </body>
</html>

4.3 超鏈接【重點(diǎn)】

超鏈接，<a
中間可以是文字，圖片，按鈕等
跳轉(zhuǎn)的方式，target _blank打開新頁面
_self 自己，可不寫

<a href="http://www.baidu.com">百度</a><br/>   
<a href="http://www.baidu.com" target="_self">百度_self</a><br/>
<a href="http://www.baidu.com" target="_blank">百度_blank</a><br/>

4.3 超鏈接案例

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>超鏈接</title>
    </head>

    <body>
<!--    超鏈接，<a>
        中間可以是文字，圖片，按鈕等
        跳轉(zhuǎn)的方式，target _blank打開新頁面
                        _self 自己，可不寫-->
    <a href="https://baidu.com">百度</a><br>
    <a href="https://baidu.com" target="_blank">百度</a><br>
    <a href="https://baidu.com" target="_self">百度</a><br>
    <a href="html/04圖片路徑.html">圖片路徑</a><br>
    <a href="html/04圖片路徑.html"><button>跳轉(zhuǎn)到圖片</button></a><br>
    <a href="https://baidu.com"><img width="400px" src="/html0601/img/微信圖片_20220312230228.jpg"></a><br>


    </body>
</html>

4.3 招聘網(wǎng)站案例

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <h1>哈哈哈技術(shù)股份有限公司Java開發(fā)工程師</h1>
    <hr>
    <b><i>上海 | 5-7年經(jīng)驗(yàn) | 本科 | 11-09發(fā)布</i></b><br>
    <hr>
    <h2>職位信息</h2>

    <p>1.本科以上學(xué)歷，計算機(jī)軟件或相關(guān)專業(yè)；</p>
    <p>2.5年以上Java/J2EE開發(fā)經(jīng)驗(yàn)，有2年以上大型項(xiàng)目開發(fā)經(jīng)驗(yàn)，具有高并發(fā)WEB應(yīng)用項(xiàng)目經(jīng)驗(yàn)；</p>
    <p>3.精通Java核心API，精通J2EE各核心模塊，精通Java各種設(shè)計模式；</p>
    <p>8.具備很強(qiáng)的學(xué)習(xí)能力及溝通能力；</p>
    <p>9.具有良好的溝通能力與團(tuán)隊合作能力；性格開朗，勇于挑戰(zhàn)；良好的人際關(guān)系，對技術(shù)有更高的追求</p><br>

    <h2>工作地址</h2>
    上班地址：哈哈大廈

    <h2>部門信息</h2>
    所屬部門：上?？偛?
    <h2>官方網(wǎng)站</h2>
    <a href="https://baidu.com" target="_blank">wind信息網(wǎng)</a>

    </body>
</html>

4.4 列表標(biāo)簽（了解）

有序列表，無序列表

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表</title>
</head>
<body>
<ul>
    <li>高數(shù)</li>
    <li>英語</li>
    <li>馬列</li>
</ul>

<p>有序列表：</p>
<ol>
    <li>打開冰箱門</li>
    <li>把大象放進(jìn)去</li>
    <li>關(guān)上冰箱門</li>
</ol>

<p>無序列表：</p>
<ul>
    <li>雪碧</li>
    <li>可樂</li>
    <li>涼茶</li>
</ul>

</body>
</html>

4.5 表格標(biāo)簽【重點(diǎn)】

table 表示一個表
tr表示表格的一行，th表示表頭，td普通的格子
align 表格居中
border 邊框
width 寬度

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>表格</title>
    </head>

    <body>
<!--    table 表示一個表-->
<!--    tr表示表格的一行，th表示表頭，td普通的格子
        align  表格居中
        border 邊框
        width  寬度-->
        <table align="center" border="1px" width="500px ">
            <tr>
                <th align="left">學(xué)號</th>
                <th>姓名</th>
                <th>入學(xué)時間</th>
                <th align="right">籍貫</th>
            </tr>

            <tr>
                <td>10001</td>
                <td>小王</td>
                <td>2023-05-10</td>
                <td align="right">江蘇南京</td>
            </tr>

            <tr>
                <td>10002</td>
                <td>小王2</td>
                <td>2023-05-11</td>
                <td>江蘇南京2</td>
            </tr>

            <tr>
                <td>10003</td>
                <td>小王5</td>
                <td>2023-05-12</td>
                <td align="right">江蘇南京3</td>
            </tr>

        </table>

    </body>
</html>

4.5 表格合并案例

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>表格合并練習(xí)</title>
    </head>
    <body>
        <table width="400px" border="1px">

<!--表頭 -->
            <tr>
                <th rowspan="2">組號</th>
                <th colspan="2">基本信息</th>
<!--                <th>基本信息</th>-->
                <th rowspan="2">院系</th>
                <th rowspan="2">總分</th>
            </tr>
            <tr>
<!--                <th>組號</th>-->
                <th>學(xué)號</th>
                <th>姓名</th>
<!--                <th>院系</th>-->
<!--                <th>總分</th>-->
            </tr>
<!--第一組-->
            <tr>
                <td rowspan="3">1組</td>
                <td>10001</td>
                <td>張望月</td>
                <td>計算機(jī)系</td>
                <td>358</td>
            </tr>
            <tr>
<!--                <td>1組</td>-->
                <td>10002</td>
                <td>張望陽</td>
                <td>軟件系</td>
                <td>348</td>
            </tr>
            <tr>
<!--                <td>1組</td>-->
                <td>10003</td>
                <td>張望星</td>
                <td>機(jī)械系</td>
                <td>338</td>
            </tr>
<!--第2組-->
            <tr>
                <td rowspan="3">2組</td>
                <td>10002</td>
                <td>王望月</td>
                <td rowspan="3" colspan="2">化工系<img height="100px" src="https://hanyu-word-gif.cdn.bcebos.com/b22108502548d479dbab406e2d7657ab2.gif"></td>
<!--                <td>364</td>-->
            </tr>
            <tr>
<!--                <td >2組</td>-->
                <td>10002</td>
                <td>王望月</td>
<!--                <td>化工系</td>-->
<!--                <td>364</td>-->
            </tr>
            <tr>
<!--                <td >2組</td>-->
                <td>10002</td>
                <td>王望月</td>
<!--                <td>化工系</td>-->
<!--                <td>364</td>-->
            </tr>

        </table>

    </body>
</html>

4.6 表單標(biāo)簽【重要】

什么是表單?

表單就是 html 頁面中,用來收集用戶信息的所有元素集合.然后把這些信息發(fā)送給服務(wù)器。比如登錄頁面等

action 輸入框中的內(nèi)容往哪里提交
method get 表示請求的方式

type text 表示文本框；
submit 表示提交框，提交所有name的值
name 提交內(nèi)容；
reset 重置;
radio 單選框，name

1 輸入框、密碼框

    身份證號：<input type="text" ><br/>
    密碼：<input type="password"><br/>

2 單選框

婚否：已婚<input type="radio" name="ismarry">   未婚:<input type="radio" name="ismarry"><br/>

3 多選框

    感興趣的項(xiàng)目：
    IT <input type="checkbox" >
    電影 <input type="checkbox" >
    游戲 <input type="checkbox" ><br/>

4 下拉菜單

婚否：已婚<input type="radio" name="ismarry">   未婚:<input type="radio" name="ismarry"><br/>

5 單選框

<select >
        <option value="">湖北</option>
        <option value="">山東</option>
        <option value="">河南</option>
        <option value="">江蘇</option>
    </select><br/>

6 文本域

自我介紹
    <textarea cols="50" rows="10"></textarea >

7 其他

   隱藏域
    <input type="hidden">    <br/>

    文件上傳
    <input type="file"><br/>

    顏色
    <input type="color"><br/>

    日期框
    <input type="date"><br/>

    email
    <input type="email"><br/>

   <br/>

4.6 表單標(biāo)簽案例

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>輸入表單</title>
    </head>
    <body>
<!--    action 輸入框中的內(nèi)容往哪里提交
        method get 表示請求的方式
        -->
<!--https://www.baidu.com/s?wd=java-->
    <form action="https://baidu.com/s" method="get">
<!--        type text 表示文本框；
            submit 表示提交框，提交所有name的值
            name 提交內(nèi)容；
            reset 重置;
            radio 單選框，name值要一樣-->
        <input type="text" name="wd">
        <input type="submit" value="百度一下">
    </form>

    <form action="#" method="get">
<!--        ?username=root&password=123#-->
        <br>
        輸入用戶名：<input type="text" name="username">
        <br>
        輸入密碼：<input type="password" name="password">
        <br>
<!--        單選框 radio，name要一樣，value也要定義-->
        性別：男<input type="radio" name="gender" value="male"> 女<input type="radio" name="gender" value="female">
        <br>
<!--        復(fù)選框 checkbox name要有-->
        興趣愛好：
        玩游戲 <input type="checkbox" value="game" name="hobby">
        打籃球 <input type="checkbox" value="籃球" name="hobby">
        寫代碼 <input type="checkbox" value="code" name="hobby">
        寫博客 <input type="checkbox" value="CSDN" name="hobby">
        <br>
<!--        下拉框 select + option -->
        籍貫：
        <select name="hometown">
            <option value="">請選擇</option>
            <option value="江蘇" >江蘇</option>
            <option value="NJ">浙江</option>
            <option value="SH">上海</option>
        </select>
        <br>
<!--       大的輸入框 textarea-->
        <textarea name="intro" cols="20" rows="2"></textarea>
        <br>
<!--      上傳文件-->
        上傳頭像：<input type="file" name="image">
<!--      時間-->
        時間：<input type="date">
        <br>
        <input type="submit" value="注冊">
        <input type="reset" value="重置">
    </form>

    <form>

    </form>
    </body>
</html>

4.7 語義化標(biāo)簽

需求 1:div 塊級標(biāo)簽、span 行內(nèi)標(biāo)簽的演示

<div>
  <input type="button" value="按鈕"><br>
  <span>
    <input type="text">
  </span>
</div>

4.8 iframe 框架標(biāo)簽【內(nèi)嵌窗口】

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>iframe</title>
</head>
<body>
<a>iframe跳轉(zhuǎn)</a>
<a href="../01入門案例.html" target="button">入門案例</a>
<a href="../02排版相關(guān).html" target="button">排版相關(guān)</a>
<a href="../04圖片.html" target="button">圖片</a>
<br>
<iframe name="button" width="500px" height="500px"></iframe>

</body>
</html>

4.9 字符實(shí)體

空格

&nbsp;

<小于號

&lt;

大于號

&gt;

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>字符實(shí)體</title>
</head>
<body>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;hr&gt;表示一條橫線
&copy;<br>
&lt;<br>
&gt;<br>

</body>
</html>

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

五、案例-健康碼

1.二維碼頁面

更新信息可以跳轉(zhuǎn)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>二維碼頁面</title>
</head>
<body>
    <img src="https://ff4humanity.github.io/FreeHealthCode/src/icon4.png" width="20px">
    蘇康碼·綠碼 張三
    <br>
    1422******32341
    <br>
    <img src="../img/health/QQ圖片20230524185216.png" width="200px">

    <br>
    信息報備<a href="updateMess.html" target="_self">  更新信息</a>

</body>
</html>

2.更新信息頁面

前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>更新信息</title>
</head>
<body>
    <img src="https://ff4humanity.github.io/FreeHealthCode/src/icon4.png" width="20px">
    <a href="index.html">返回</a>
    <br>

    <form action="#" method="get">
        填報人姓名：<br>
        <input type="text" name="name">
        <br>
        證件號碼：<br>
        <input type="text" name="idCard">
        <br>
        手機(jī)號碼：<br>
        <input type="text" name="phone">
        <input type="submit" value="更新">
    </form>

    <form action="https://" method="get">
        <hr width="180" align="left">
        1.您是從哪里來蘇州的？
        <br>
        省
        <select name="comeFromS">
            <option value="1">江蘇</option>
            <option value="2">浙江</option>
            <option value="3">上海</option>
        </select>
        市
        <select name="comeFromC">
            <option value="1">南京</option>
            <option value="2">杭州</option>
            <option value="3">黃埔</option>
        </select>
        區(qū)
        <select name="comeFromQ">
            <option value="1">江寧</option>
            <option value="2">寧江</option>
            <option value="3">上海</option>
        </select>
        <br>
        <hr width="180" align="left">
        2.7天是否接觸過發(fā)熱咳嗽人員？
        <br>
        是<input type="radio" name="seven" value="y">
        否<input type="radio" name="seven" value="n">
        <br>
        <hr width="180" align="left">
        3.是否發(fā)熱？
        <br>
        是<input type="radio" name="fare" value="y">
        否<input type="radio" name="fare" value="n">
        <br>
        <hr width="180" align="left">
        4.同行人有無手機(jī)？
        <br>
        是<input type="radio" name="hasPhone" value="y">
        否<input type="radio" name="hasPhone" value="n">
        <hr width="180" align="left">
        知情通知：
        <br>
        &nbsp;&nbsp;&nbsp;·遵守法律<br>
        &nbsp;&nbsp;&nbsp;·誠實(shí)守信<br>
        &nbsp;&nbsp;&nbsp;·進(jìn)行授權(quán)<br>
        <input type="checkbox" value="Yes" name="know">本人知情同意
        <br>
        <input type="submit" value="提交">
        <input type="reset" value="重置">
    </form>
</body>
</html>

總結(jié)

1.html骨架，html常見標(biāo)簽；
2.表單的提交form，超鏈接，圖片；
3.iframe框架標(biāo)簽，可以作為內(nèi)嵌窗口；文章來源地址http://www.zghlxwxcb.cn/news/detail-468064.html

到了這里，關(guān)于前端基礎(chǔ)（HTML）——html介紹 & 常用標(biāo)簽 & 幾個案例的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！

本文來自互聯(lián)網(wǎng)用戶投稿，該文觀點(diǎn)僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務(wù)，不擁有所有權(quán)，不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載，請注明出處：如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符，請點(diǎn)擊違法舉報進(jìn)行投訴反饋，一經(jīng)查實(shí)，立即刪除！

分享到：

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

【前端｜HTML系列第2篇】HTML零基礎(chǔ)入門之標(biāo)簽元素
大家好，歡迎來到前端入門系列的第二篇博客。在這個系列中，我們將一起學(xué)習(xí)前端開發(fā)的基礎(chǔ)知識，從零開始構(gòu)建網(wǎng)頁和Web應(yīng)用程序。本篇博客將為大家介紹HTML（超文本標(biāo)記語言）常用標(biāo)簽元素，幫助零基礎(chǔ)小白快速入門。掌握html常用表情的使用、基礎(chǔ)特性以及用途。
2024年02月11日
瀏覽(20)
【劇前爆米花--前端三劍客】html的一些常用標(biāo)簽及其實(shí)例
作者：困了電視劇專欄：《JavaEE初階》文章分布：這是一篇關(guān)于html前端的文章，在這篇文章中我會簡單介紹一些常用的html標(biāo)簽，并給出他們的應(yīng)用實(shí)例，希望對你有所幫助！ ? 目錄 html常見標(biāo)簽標(biāo)題標(biāo)簽段落標(biāo)簽換行標(biāo)簽格式化標(biāo)簽圖片標(biāo)簽超鏈接標(biāo)簽表格標(biāo)簽列表
2024年02月15日
瀏覽(21)
零基礎(chǔ)學(xué)習(xí)HTML5（各標(biāo)簽語法介紹）
vscode + 谷歌瀏覽器 vscode下載地址：https://code.visualstudio.com/ 谷歌可以使用360軟件管家安裝在vscode中安裝插件： open in browser ，點(diǎn)擊Extensions后搜索對應(yīng)插件名然后點(diǎn)擊安裝Install 安裝完成后可在html文件中右鍵多了兩個選擇：或者安裝 live server 插件，然后右鍵選擇 Open with live
2024年02月07日
瀏覽(28)
前端HTML基礎(chǔ)：表單標(biāo)簽看這一篇就行了。
表單標(biāo)簽： ?? ?在網(wǎng)頁中為了收集用戶資料，此時你就會用到表單。在HTML中，一個完整的表單由表單域、表單控件和提示信息3個部分組成 1.表單域表單域就是一個包含表單元素的區(qū)域。在HTML標(biāo)簽中，form標(biāo)簽用于定義表單域，以實(shí)現(xiàn)用戶信息的收集和傳遞。 form會把它范
2024年02月21日
瀏覽(19)
前端基礎(chǔ)第一天-html-綜合案例
通過綜合案例，主要復(fù)習(xí)：目錄文件夾今日所學(xué)標(biāo)簽路徑錨點(diǎn)鏈接
2024年02月14日
瀏覽(23)
【前端｜HTML系列第1篇】HTML的基礎(chǔ)介紹與初次嘗試
大家好，歡迎來到前端入門系列的第一篇博客。在這個系列中，我們將一起學(xué)習(xí)前端開發(fā)的基礎(chǔ)知識，從零開始構(gòu)建網(wǎng)頁和Web應(yīng)用程序。本篇博客將為大家介紹HTML（超文本標(biāo)記語言）的基礎(chǔ)概念和標(biāo)簽，幫助你快速入門。本期學(xué)期目標(biāo)是：了解什么是HTML 學(xué)習(xí)了解一個完整
2024年02月11日
瀏覽(30)
零基礎(chǔ)學(xué)前端（二）用簡單案例去理解 HTML 、CSS 、JavaScript 概念
該篇適用于從零基礎(chǔ)學(xué)習(xí)前端的小白初學(xué)者不懂代碼得含義也要堅持模仿逐行敲代碼，以身體感悟帶動頭腦去理解新知識 HTML，CSS，JavaScript 都是單獨(dú)的語言；他們構(gòu)成前端技術(shù)基礎(chǔ)；（1）HTML：負(fù)責(zé)網(wǎng)頁的架構(gòu)；（2）CSS：負(fù)責(zé)網(wǎng)頁的樣式，美化；（3）JavaScript（JS）：負(fù)責(zé)
2024年02月08日
瀏覽(28)
CSS樣式前端HTML頁面常用CSS效果實(shí)現(xiàn)及其相關(guān)配置信息------前端入門基礎(chǔ)教程
!DOCTYPE html !-- 這是HTML的注釋 -- html lang=\\\"en\\\" id=\\\"myHtml\\\" ?? ?head ?? ??? ?!-- 這里不是設(shè)置了編碼,而是告訴瀏覽器,用什么編碼方式打開文件避免亂碼 -- ?? ??? ?meta charset=\\\"UTF-8\\\" ?? ??? ?meta name=\\\"viewport\\\" content=\\\"width=device-width, initial-scale=1.0\\\" ?? ??? ?titleHtmlAll/title ?? ??? ?
2024年02月05日
瀏覽(35)
前端 | （五）CSS三大特性及常用屬性 | 尚硅谷前端html+css零基礎(chǔ)教程2023最新
學(xué)習(xí)來源：尚硅谷前端html+css零基礎(chǔ)教程，2023最新前端開發(fā)html5+css3視頻系列筆記：【HTML4】（一）前端簡介【HTML4】（二）各種各樣的常用標(biāo)簽【HTML4】（三）表單及HTML4收尾【CSS2】（四）CSS基礎(chǔ)及CSS選擇器【CSS2】（五）CSS三大特性及常用屬性【CSS2】（六）CSS盒子模型
2024年02月17日
瀏覽(32)
HTML案例-2.標(biāo)簽綜合練習(xí)
目錄效果知識點(diǎn) 1.圖像標(biāo)簽 2.鏈接標(biāo)簽 3.錨點(diǎn)定位 4.base標(biāo)簽源碼頁面1 頁面2 屬性屬性值描述 src URL 圖像的路徑 alt 文本
2024年03月16日
瀏覽(15)

<b id="b8k8x"></b>