溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

HTML基礎單頁面實例分析

發(fā)布時間:2022-03-05 16:35:53 來源:億速云 閱讀:176 作者:iii 欄目:web開發(fā)

這篇文章主要介紹“HTML基礎單頁面實例分析”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“HTML基礎單頁面實例分析”文章能幫助大家解決問題。

  <html><!--html的語法由標簽(形式為<keyword>),標簽的屬性(keword右邊的鍵="值"對),標簽之間的內容組成,每個標簽定義了一個元素,

  屬性則影響了該元素的視覺表現(xiàn)和邏輯上的動作響應等,-->

  <!--位于<!&hellip;中的為html的注釋語句-->

  <head ><!--head標簽用于定義文檔的頭部,它是所有頭部元素的容器,其中元素可以引用腳本、指示瀏覽器在哪里找到樣式表、提供元信息等等。-->

  <title>Html</title><!--title標簽定義了在瀏覽器上顯示的頁面標題,是head中唯一必須的元素-->

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><!--meta可提供有關頁面的元信息,比如針對搜索引擎和更新頻度的描述和關鍵詞。

  注:字符集屬性charset應在一開始給出(應與你編輯器保存該html時使用的字符集一致,否則在它之前的中文顯示可能不正確-->

  <meta name="author" content="yhavi" >

  <meta name="keywords"

  content="HTML, DHTML, CSS, XML, XHTML, JavaScript">

  <meta http-equiv="Refresh" content="5;url=" /><!--這里實現(xiàn)5秒后重定向到url指出的位置。要使其失效請注釋掉它。

  注:當使用絕對尋址時需要添加http://于簽名-->

  <script type="text/javascript">

  document.write("5秒鐘后跳轉!")

  </script><!--script用于加入腳本語言片段如javascript 可使用src屬性引用代碼或直接在標簽內容里用純文本寫代碼-->

  <base href=""  target="_blank"> </base><!--base的href屬性重新定義了整個html中URL尋址的相對起點(不定義base時使用該頁面的URL為起點)

  位于bass標簽中的target屬性定義了整個頁面中點擊超鏈接時打開鏈接的位置,_blank示意在新窗口中打開-->

  <link><!--link一般用于使用外聯(lián)的css樣式表,詳見>

  </head>

  <body><!--body 元素定義文檔的主體。body 元素包含文檔的所有內容(比如文本、超鏈接、圖像、表格和列表等等。)-->

  <h2 name="fortarget"><!--h2到h7標簽定義了標題并分別對應不同的標題大小。另,html中每個元素都可定義name或id屬性用于標識該標簽-->

  正文主題

  </h2>

  <p><!--p定義了段落,段落與段落間會自動換行,瀏覽器同時會在相鄰的段落之間插入一些垂直的間距。但注意,

  瀏覽器忽略了源代碼中的排版(省略了多余的空格和換行)故應使用<br/>標簽實現(xiàn)換行。

  另,<br> 標簽是空標簽(意味著它沒有結束標簽,因此這是錯誤的:<br></br>)。在 XHTML 中,把結束標簽放在開始標簽中,也就是 <br />。-->

  感謝閱讀

  歡迎指正

  換<br/>

  行

  </p>

  <hr/><!--hr水平分隔線-->

  <pre>

  <strong> 你</strong>

  們 好

  </pre><!--pre標簽內的內容允許保留空格和換行等,可用于呈現(xiàn)代碼(當然更好的是用<code>方便瀏覽器做出處理)。

  其中不可嵌套會使段落斷開的標簽,僅允許物理樣式和基于內容的樣式變化(如上面的<strong>標簽),還有鏈接、圖像和水平分隔線-->

  <!--pre內的符號也會被轉換,<:< ; > : > ; " : " ;    : 不間斷空格; & : &

  更多請參考>

  <!--<strong>等特殊樣式定義標簽見>

  <ul><!--無序列表-->

  <li>第一項</li>

  <li>第二項</li>

  </ul>

  <ol><!--有序列表-->

  <li>第一項</li>

  <li>第二項</li>

  </ol>

  <dl><!--自定義列表-->

  <dt>First term</dt><!--定義項名-->

  <dd>Definition</dd><!--定義項的內容-->

  <dt>Next term</dt>

  <dd>Definition</dd>

  </dl>

  <table border="1"><!--table定義了表格,其可見程度和大小等視覺效果屬性可控 詳見>

  <tr><!--tr定義表的行-->

  <th>Month</th><!--th定義表中該行的標題項-->

  <th>Savings</th>

  </tr>

  <tr>

  <td>January</td><!--td定義與前面tr定義的標題對應的項-->

  <td>$100</td>

  </tr>

  </table>

  <form action="" method="post/get"><!--form定義了表單,用于向服務器發(fā)送用戶輸入

  action屬性表明目標URL(這里隨便寫了個所有下面的提交可能不會有效果),

  method表明http請求方法的類型 對應不同的數(shù)據(jù)發(fā)送方式(這會影響web后端服務器的處理)但僅限GET和POST

 ?。蓞⒖?gt;

  <input type="text" name="lastname"

  value="Nixon" size="30" maxlength="50"><!--表單中的輸入元素均使用input標簽,通過type屬性選擇不同的元素。text為文本域-->

  <input type="password"><!--password為密碼輸入框(輸入的字符以非明文方式顯示)-->

  <input type="checkbox" checked="checked"><!--checkbox為復選框-->

  <input type="radio" checked="checked"><!--radio為單選框-->

  <input type="submit"><!--submit為按鈕,點擊此處同時將本頁中各個表單的內容發(fā)送到各表單URL所處服務器。

  注:type為button的也是一種按鈕,但它不觸發(fā)數(shù)據(jù)的發(fā)送和跳轉,一般用于和avascript腳本關聯(lián)觸發(fā)腳本程序的運行-->

  <input type="reset"><!--reset為重置按鈕。重置按鈕會清除表單中的所有數(shù)據(jù)。-->

  <input type="hidden" value="hiddenmessage"><!--hidden定義隱藏的輸入字段。用戶不可見但發(fā)送數(shù)據(jù)時其value屬性的值仍會發(fā)送。

  注:表單中輸入的文本或做出的選擇實際上最后改變了對應元素的value屬性,

  在提交表單時這些value屬性的值會根據(jù)form標簽中methon屬性標明的方式以一定格式發(fā)送到URL所指示的服務器-->

  <input type="file" /><!--file用于文件上傳-->

  <select><!--select下拉單選框,帶有selected的option選項會被預選 select更多修飾性屬性(如規(guī)定必選)見>

  <option>Apples

  <option selected>Bananas

  <option>Cherries

  </select>

  <textarea name="Comment" rows="10"

  cols="20"></textarea><!--textarea是比文本域更大的文本輸入框-->

  </form>

  <!--frameset用于定義框架集(即在一個窗口中打開一個或多個html頁面,可用于實現(xiàn)導航(一個頁面存放書簽列表另一個用于顯示書簽指向的頁面))

  在此由于不方便展示 感興趣可參考>

  <a href="">超鏈接</a><!--a標簽表示超鏈接,在href屬性中給出鏈接的目標URL.注,a也有target屬性用于定義在哪里打開鏈接-->

  <br/>

  <a href=""><img src="" alt="圖片超鏈接"></a>

  <!--圖片也可以用于承載超鏈接,alt屬性存放當圖片無法正常顯示時顯示的替代字符串。

  更復雜的用于控制圖片中響應點擊位置的<map>標簽見>

  <a href="#fortarget">跳轉到前面</a><!--使用href=的形式可調轉到URL#itemname所在的位置(相當于滾輪自動轉到該元素顯示處),

  注意,仍然遵循相對尋址,故應注意前面的base給出的起點會影響此處的效果

  該方法可用于創(chuàng)建頁內導航書簽或跨頁導航書簽(跳轉到另一頁面的特定某處)-->

  </body>

  </html>

關于“HTML基礎單頁面實例分析”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關的知識,可以關注億速云行業(yè)資訊頻道,小編每天都會為大家更新不同的知識點。

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經查實,將立刻刪除涉嫌侵權內容。

AI