HTML+CSS基礎入門-第一天(HTML語法)

本博客為線上學習某課程筆記,供參考,供學習

什么是HTML標記語言?

表示網頁信息的符號標記語言。

開發工具

自帶筆記本 等編輯器 我這里用:NotePad++

HTML語言特點。

  • 可以設置文本的格式,比如標題,字號,文本顏色,段落等等。
  • 可以創建列表
  • 可以插入圖像和媒體
  • 可以建立表格
  • 超鏈接,可以使用鼠標點擊超鏈接來實現頁面之間的跳轉

HTML的標記和他的屬性

  1. HTML文檔的保存格式: .html .htm .xhtml

  2. 標記和被標記的內容構建出HTML文檔
    格式:

     <標記>
             內容
     </標記>
    

例如:在編輯器中寫下以下代碼 保存為.html文件

    <html>
        <body>
            Hello word!
        </body>
    </html>

在瀏覽器中打開此文件可看網頁中出現1-1,咱們寫了第一個程序,有點小激動。

1-1
  1. 標記的屬性

標記的屬性就是用來控制我們的內容(圖像,文本等的)如何顯示

格式:

<標記 屬性1=屬性值 屬性2=屬性值 .......>
    內容
</標記>

例如

<html>
    <body bgcolor="red">
        Hello word!
    </body>
</html>

在瀏覽器中打開此文件可看網頁中出現1-2,可見背景變成了紅色,也就是說"bgcolor"這個屬性是標記背景顏色的,大家可以換個顏色試試。

1-2

語法不區分字母大小寫

" <HTML> <Html> <html> " 都是定義相同的標記,但是在編寫網頁的時候盡量使用小寫

文檔注釋

例如

<html>
    <body >
        我是顯示出來的語言
        <!--我是不會被顯示出來的語言-->
    </body>
</html>

大家可自行到網頁上查看效果

代碼格式

空格鍵和回車鍵在網頁中不會起到任何作用,我們為了讓代碼清晰易讀,可以使用空格和回車鍵進行編排

注意:縮進時保持嚴格的規則,以“tap”鍵進行縮進

字符實體

什么是字符實體

比如我們想在網頁上顯示一個"<"小于符號,但是"<"在HTML中是文檔標記的開始語言,如果我們直接用"<"會出錯,所以我們就會用一些實體名稱來代替.
例如:

<html>
    <body >
        &lt;
        我是顯示出來的語言
        <!--我是不會被顯示出來的語言-->
    </body>
</html>

瀏覽器顯示結果為


1-4

常見的字符實體

1-3
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,923評論 18 139
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,796評論 1 92
  • 引言 在日常開發Android中,很多時候會遇到和WebView打交道,對CSS HTML JS不是很清楚的話是完...
    張文靖同學閱讀 2,880評論 0 11
  • 簡介網絡瀏覽器很可能是使用最廣的軟件。在這篇入門文章中,我將會介紹它們的幕后工作原理。我們會了解到,從您在地址欄輸...
    wengjq閱讀 2,071評論 2 15
  • 今天扎帳了,代表預售終于結束了,館里即將進入到正式營業的階段了,通過這兩天的事情,發現真的是時候充電了,就像偉哥說...
    許金麗閱讀 288評論 1 3