HTML5学习笔记(一):HTML简介
Web前端涵蓋的內容較多且雜,主要由3個部分組成:HTML標記語言、CSS樣式語言和JavaScript腳本語言組成,而下面我們將先學習最新的標記語言HTML5。
<!DOCTYPE>標記
HTML也分為多個版本,為了讓瀏覽器可以確切的知道當前文檔使用的HTML版本,就需要添加一個DOCTYPE的標記,目前主要使用的有下面3種版本:
HTML 5
<!DOCTYPE html>HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">XHTML 1.0
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">注意該聲明只是一個標記,不像其他的標簽的寫法,不需要有</xxx>的標記來表示其結束。
我們可以發現最新的HTML5是最簡單的一種定義方式。
<html>標簽
該標簽是html文件的根節點,html文件的所有內容都必須包含在該標簽中。
我們來看一個簡單的html5文件:
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>HTML5學習</title> </head> <body></body> </html>我們會發現html標簽有一個名為lang的屬性,該屬性表示當前網頁的基準語言是英文,我們可以修改為zh表示是中文,也可以不寫表示未知,該屬性是用來協助瀏覽器進行一些識別的,比如當瀏覽器發現當前網頁是英文時會自動提示是否翻譯等等操作,該屬性主要功能如下:
<head>標簽
該標簽用來定義當前網頁的屬性,head的內容不會顯示給用戶看,一般用來定義網頁的標題,引用的其它文件和一些特定的元數據。
<meta>標簽
該標簽用來定義各種自定義的元數據,例子中的charset表示了當前網頁使用的編碼格式,讓瀏覽器可以使用正確的編碼解析當前網頁,當然我們的網頁也必須保存為對應的編碼哦。
再比如大部分的搜索引擎都會對網頁的mate標簽進行解析用來對該網頁進行分類和顯示,我們以博客園的首頁為例來看,可以發現其定義了下面兩個元數據標簽:
<meta name="keywords" content="開發者,博客園,開發者,程序猿,程序媛,極客,編程,代碼,開源,IT網站,Developer,Programmer,Coder,Geek,技術社區" /> <meta name="description" content="博客園是一個面向開發者的知識分享社區。自創建以來,博客園一直致力并專注于為開發者打造一個純凈的技術交流社區,推動并幫助開發者通過互聯網分享知識,從而讓更多開發者從中受益。博客園的使命是幫助開發者用代碼改變世界。" />當我們使用搜索引擎搜索時可以看到搜索頁面展現的簡介內容就是description描寫的內容:
需要注意的是:
- 在 HTML 中,<meta> 標簽沒有結束標簽。
- 在 XHTML 中,<meta> 標簽必須被正確地關閉。
<title>標簽
用來定義網頁的標題,是head標簽中唯一必備的標簽。
<body>標簽
該標簽用來定義當前網頁的內容。下面我們來看看一些基本的標簽。
<h>標題
標題有h1到h6六種,用來顯示文本的標題,其大小從大到小。
<p>段落
段落標簽表示一個文本的段落。
<a>超鏈接
超鏈接標簽用來定義一個可點擊和轉向新頁面的超鏈接文件。
<a href="http://www.cnblogs.com/" target="_blank">博客園</a><img>圖像
用來顯示一個圖片。
<img src="images/1.jpg"/>下面的筆記我們會逐個學習HTML相關的知識。
轉載于:https://www.cnblogs.com/hammerc/p/5683795.html
與50位技術專家面對面20年技術見證,附贈技術全景圖總結
以上是生活随笔為你收集整理的HTML5学习笔记(一):HTML简介的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Codeforces 697C Lore
- 下一篇: HTML5 音频audio 和视频vid