HTML+CSS基礎入門-第一天(HTML-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

發佈了32 篇原創文章 · 獲贊 0 · 訪問量 9973
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章