HTML基礎——2017.10.12學習筆記

HTML標簽

HTML 標簽通常是成對出現的,比如<b></b>?

標簽對中的第一個標簽是開始標簽,第二個標簽是結束標簽


<html>

<body>

<h1>你好呀,李銀河。</h1>

<p>我叫王小波。</p>

</body>

</html>


<html></html>之間的文本描述網頁

<body></body>之間的文本是可見的頁面內容

<h1></h1>之間的文本是一級標題(還有h2、h3、h4、h5、h6)

<p></p>之間的文本是段落


用記事本來編輯HTML

在記事本文件菜單中選擇“另存為”,保存時,既可以使用 .htm 也可以使用 .html 這兩個擴展名

在瀏覽器中運行這個HTML文件

直接在保存位置雙擊打開,得到上圖

標題通過<h1> - <h6>定義

段落通過<p>定義

鏈接通過<a>定義

例如:<a >This is a link</a>

在href屬性中是鏈接的地址

圖像通過<img>定義

例如:<img src="xxxxxx.jpg" width="100" height="100" />


HTML元素的嵌套

從開始標簽到結束標簽之間的叫HTML元素,大多數元素可以嵌套,比如最開始那段代碼,html嵌套了body,body又嵌套了h1和p

元素可以為空,<br>就是沒有關閉標簽的空元素,元素一定要有關閉標簽才有效哦,<br />是關閉空元素的正確方法

HTML元素大小寫通用,但推薦小寫為佳


屬性

HTML標簽可以擁有屬性,以便我們知道元素的更多信息,屬性總是以 名稱/值對? 的方式出現,比如:name="value" ,屬性必須在開始標簽中規定

例一:<h1>定義標題,<h1 align="center">使得標題居中

例二:<body>定義主體,<body bgcolor="yellow">使得背景顏色變為黃色

例三:<table>定義表格,<table border="1">使得表格邊框的粗度變為1

屬性值必須帶有引號單引號也可以)


完整的屬性參考手冊

1? ?適用于大多數HTML元素的屬性

2? ?更加完整的標準屬性參考手冊


標題詳解

<h1>最大,<h6>最小

瀏覽器會在標題的前后自動添加空行

<hr />標簽創建水平線,可用于分割內容(即分割線)

我們可以將注釋插入代碼中,便于理解,瀏覽器不會顯示這些注釋

注釋是這樣寫的:<!-- xxxxxx -->

注意,左邊的括號要緊跟一個感嘆號,右邊的括號不需要

當我們在任何一個網頁中,只需右鍵“查看網頁源代碼”就可以看到最原始的HTML代碼啦


段落詳解

瀏覽器會在段落的前后自動添加空行

如果忘記了結束標簽,大多數瀏覽器還是可以正確運行,但是不要經常這樣,有可能會造成意外的結果或錯誤

折行,就是在不產生一個新段落的情況下進行換行,請使用<br />標簽,不要用<p></p>,這是個壞習慣!

同時,盡管<br>也能在大多數瀏覽器中使用,但是<br />還是更好喔


樣式詳解

style用來改變元素的樣式,在開始標簽<p>中加入,例如:<p style="font-size:30px;family:times;color:green">xxxxxxx</p>

樣式對于CSS文件一樣有用,可以間接在獨立的樣式表中定義

background-color屬性定義了背景顏色

<html>

<body style="background-color:yellow">

<h2 style="background-color:white">近日我體內寂寞癌細胞惡化</h2>

<p style="background-color:pink">害我成了原發性失眠者</p>

<h2 style="background-color:blue">唑吡坦控釋劑地西伴氯氮卓</h2>

<p style="background-color:orange">怎么對我不起一點效果</p>

</body>

</html>


style屬性淘汰了舊的顏色更改方式。上面的文字是我超迷的焦邁奇的《怎么我睡不著你也不來救我》的歌詞嘿嘿嘿

font-family、color還有font-size定義了文本的字體、顏色、尺寸

text-align定義了文本對齊

<html>

<body>

<h1 style="text-align:center">昨天已是過去</h1>

<h1 style="text-align:center">明天更多回憶</h1>

</body>

</html>


style屬性淘汰了舊的align屬性

文本格式化詳解

<b>定義粗體

<big>定義大號字,<small>定義小號字

<em>定義著重文字

<i>定義斜體

<strong>定義加重語氣

<sub>定義下標,<sup>定義上標

<ins>定義插入字,<del>定義刪除字

<abbr>定義縮寫,<acronym>定義首字母縮寫

<bdo>定義文字方向

<blockquote>定義長的引用,<q>定義短的引用

<dfn>定義一個定義項目


延伸

改變文本的外觀和含義

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

推薦閱讀更多精彩內容