html簡單入門

編寫頁面使用的是html語言,具體什麼是html語言自己百度。

網頁在html中主要分爲兩個部分:頭部(head),主體(body)

下面寫一個簡單頁面
1.首先創建一個文本文檔文件,並將其後綴.txt改爲.html。名稱改爲HelloWorld,名稱可以隨便改。效果入下圖(如果新建文件的名稱中沒有.txt,須要在系統設置顯示後綴名,具體設置方法查看看https://jingyan.baidu.com/article/e52e3615804fad40c60c51af.html) wKioL1jN-EuS12CcAAAQqtP78eQ150.jpg-wh_50


2.右擊該文件通過記事本打開編輯,填入如下代碼,保存,雙擊文件打開,會默認使用瀏覽器打開

<html>

<head>

<title>我的第一個頁面</title>

</head>

<body>

<h1>Hello World</h1>

</body>

</html>

頁面打開效果如下

wKiom1jN-qagRSERAAAxxs9ALmI518.jpg-wh_50

下面對代碼進行解析


1.頁面代碼一開始都先用html開頭,告訴瀏覽器這是一個html的頁面代碼


2.我們可以看到html中包含了head 和 body 兩個標籤。這兩個標籤是頁面最基本的標題,head裏面主要放置頁面信息,例如title,其中的內容會出現在瀏覽器上方。


3.body中的內容會出現在頁面。代碼中body中包含了一個h1標籤,h1標籤中的內容Hello World就出現在頁面當中。


除了h1這個標籤,html還定義很多標籤,不同的標籤,顯示效果不一樣。下面我們看看h1 到 h6的顯示效果


打開文件,編輯代碼爲

<html>

<head>

<title>我的第一個頁面</title>

</head>

<body>

<h1>Hello World h1</h1>

<h2>Hello World h2</h2>

<h3>Hello World h3</h3>

<h4>Hello World h4</h4>

<h5>Hello World h5</h5>

<h6>Hello World h6</h6>

</body>

</html>

代碼之間要有縮進,這樣才美觀
保存打開,效果如下圖

wKiom1jN_aeBFoddAABIaRP5GCw889.jpg-wh_50

我們可以看到,字體大小不一樣了。不同的標籤顯示效果是不一樣的。


平時我們看到的網頁都是很漂亮的,有菜單之類排列的整齊美觀,這就是佈局問題了,具體看下一遍博文

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章