1. 程式人生 > 實用技巧 >HTML基礎入門1

HTML基礎入門1

1.HTML是誰發明的

發明者為Tim Berners Lee,李爵士;發明HTML只是他傑作的其中之一。他寫出了第一個瀏覽器,伺服器;併發明瞭WWW-全球資訊網,接著發明了HTML,URL,併發明瞭HTTP(看不見的部分由他處理)

2.HTML起手式

現在vscode 以及大部分編輯器,都會遵循emmet語法規則;直接一個!=> Tab 解決,這樣可以快速生成最基礎的一個結構。

  • DOCTYPE 文件型別 html
  • lang 語言 zh-CN、en...
  • meta-> charset 字元編碼 UTF-8 統一認證的編碼
  • meta-> viewport 視口;content 相容手機等設定的引數
  • title 頁面的頭部資訊

content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"

3.常用的表章節的標籤

  • h1~h6、1到6型號的標題,級別從大到小,font-size 和font-weight會逐漸變小,
  • section章節
  • article正文部分
  • main主要內容塊
  • aside旁支內容
  • div 劃分區域(常用)
    除此之外,其他的p header footer…等等HTMl附有文字意義的標籤,都是自帶樣式的,因為HTML比css先出世。

4.HTML全域性屬性(常見)

  • class類,有共同點的元素的歸集
  • id ,整個文件中元素的唯一標識
  • contenteditable 標籤內容是否可編輯
  • draggable 是否可拖動,一般配合自定義拖拽事件
  • title游標浮上展示全部文字內容,現在許多元件庫也有更加優雅的顯示
  • tabIndex 是否加入文件元素的聚焦隊伍,0表示最後一個到它,-1 表示不加入,其他正整數越小越先到它聚焦

5.常用內容標籤

  • a anchor超連結 href 屬性填寫跳轉的url,若換成#id可當做錨點定位使用;target屬性設定何處顯示新的資源;download=下載檔名(在工作中經常會需要用到處理檔案流的案例)
  • strong 強調,字型會加粗
  • em emphasis 也表示強調,偏向語氣上的,字型會變斜
  • code表示程式碼區域
  • pre可定義預格式化的文字。包圍的文字會保留空格和換行符,且文字也會變成等寬