Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
給大家推薦一下學習研究HTML5必備的一些個網站,更加有利于大家對html5的學些和研究。
1. W3C HTML 5 權威教程,學習HTML5的各種標簽,查詢參考手冊。
2. HTMLDemos可以插件HTML5標簽在各瀏覽器的兼容性,同時你還可以查看各種HTML5的標準Demo演示。
3. 蘋果提供的HTML5演示站點,提供很多很絢麗的HTML5Demo。鏈接
4. 測試瀏覽器對HTML5的支持,并打分,可以知道你當前的瀏覽器對HTML5的支持情況如何,各種標簽和組件的支持情況。鏈接
5.360的HTML5基地。鏈接
6. WHATWG博客是網絡超文本應用技術工作小組(Web Hypertext Application Technology Working Group)的博客。鏈接
7. HTML5醫生發表了許多文章,都是關于HTML5及其語義、及如何正確使用它的。他們也通過“詢問醫生”收集了很多問題,并在文章中予以回答,所有人都可從中受益。鏈接
8. 這是一個以表格制成的備忘單形式的單頁面,描述了HTML5、CSS3、SVG及其他未來網絡技術的特征。鏈接
9. 這個備忘單就是一個簡單的可視網格,包含了所有HTML5標簽和相關的屬性。鏈接
10 .一個提供HTML5各種功能演示的網站,提供各種HTML5的顯示Demo。鏈接
11. 這個網站提供了大量的HTML5游戲資源,喜歡HTML5游戲的童鞋們,可以千萬別錯過哦。鏈接
12. 一個HTML 5的文檔資料網站,做得很出色。介紹的圖片全是用了涂鴉的方式,很直觀,很可愛的網站。鏈接
13.h5之家(中文學習園地)。鏈接
今天就給大家推薦到這里,這15個網站,基本上可以算得上是HTML5學習研究的上上至寶了。如果你也有更好的HTML5網站推薦,歡迎評論并留下網址信息,方便整理。
出于對PMCAFF用戶的尊重,任何在PMCAFF產品經理社區發布的內容,在未經允許的情況下,不得在任何平臺被直接或間接發布使用或被用于其他任何商業目的。如有違反上述聲明者本網站將追究其相關法律責任。
微信公眾號:pmcaffcom
投稿郵箱:tougao@pmcaff.com
Greated by PMCAFF產品經理社區 - www.pmcaff.com
果想開發一個網站,除了要精通后端開發語言(如:php)外,還要精通HTML代碼。那么,什么是HTML呢?HTML是一種超文本標記語言,它包含有眾多的標簽,我們可以通過這些標簽,把不同的internet資源(如:文字、圖片、視頻、音頻、表單等等)整合在一個統一的文檔中,這就形成了我們可以看得見的網頁。那么,HTML都有哪些常用的標簽呢?
html5文檔類型聲明:<!doctype html>
html4文檔類型聲明:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
這個標簽是html最外層的標簽,所有其它的HTML標簽都要放在這個標簽的內部。
<html>
<head></head>
<body></body>
</html>
在HTML標簽中,有的標簽是成雙成對的,如:<html></html>(如下圖);而有的標簽是單個的,如:<hr>橫線標簽。
head頭部有以下幾種常用標簽:
meta:主要提供有關頁面的元信息。
link:用來定義文檔與外部資源的關系,最常用的是調用CSS樣式文件。
title:頁面標題的標簽。
script:用來調用JS文件或JS代碼。當然,script標簽也可以在body主體中使用。
1、塊級標簽。
塊級標簽的特性是:獨自占有一行;標簽的高與寬、邊距可以修改;沒有設置寬與高時,默認繼承父標簽。例如:
<div>div1</div>
<div>div2</div>
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
前端頁面顯示的效果如下圖:
常用的塊級標簽有:div、h1、h2、h3、h4、h5、h6、hr、menu、ul、ol、li、dl、dt、dd、table、p、form 。
2、內聯標簽。
內聯標簽與塊級標簽不同,它不能獨自占有一行,會與其它內聯標簽在同一樣展示;內聯標簽的高與寬、上下邊距是不能修改的,它里面的文字或圖片有多高,它就是多高。例如如下代碼:
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
<span>span1</span>
<span>span2</span>
CSS樣式代碼跟塊級標簽的例子是一樣的,而顯示的效果就不一樣了,寬與高、上下邊距沒有效果。如下圖:
常用的內聯標簽有:span、a、b、strong、i、em 。
3、內聯塊級標簽。
內聯塊級標簽,既有一些內聯標簽的特性,也有一些塊級標簽的特點:它不能獨自占有一行,但是可以修改它的寬度和高度。例如下面這段代碼:
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
<img src="w5.jpg" alt="">
<img src="w5.jpg" alt="">
CSS樣式代碼跟塊級標簽的那個例子仍然是一樣的,圖片的寬和高、上下邊距修改成功,而2個圖片不能獨自占有一行,而是在同一行。如下圖:
常用的內聯塊級標簽有:img、input、textarea。
4、區域標簽。
所謂區域標簽,就是主要用來劃分布局頁面區域的。如:頭部、主體內容、側邊欄、底部。這樣劃分的好處是:讓頁面布局更加清晰明了。
常用的區域標簽有:header(頭部)、footer(底部)、nav(導航)、aside(側邊欄)、section(主體)、article(獨立內容)。
5、表單標簽。
這個表單標簽我們也是會經常用到的,如:登錄網站的時候、提交數據的時候。如下圖的評論表單:
?表單常用的標簽有:form、input、select、option、textarea 。
以上就是我們開發網頁時,會常用到的HTML標簽。當然,HTML標簽遠不止這些,尤其是html5出來后,新增了許多的新標簽。但是,有些標簽在我們開發中很少用到,所以,這里就沒有做相應的介紹。
TML5發展如火如荼,隨著各大瀏覽器對 HTML5 技術支持的不斷完善以及HTML5 技術的不斷成熟,未來 HTML5 必將改變我們創建 Web 應用程序的方式。今天這篇文章向大家推薦8款優秀的HTML5開發工具,幫助你更高效的編寫 HTML5 應用。
1、Initializr
Initializr 是制作 HTML5 網站最好的入門輔助開發工具,你可以使用提供的特色模板快速生成網站,也可以自定義,Initializr 會為你生成代碼簡潔的可定制的網頁模板。
2、HTML5demos
想知道你的瀏覽器是否支持 HTML5 Canvas 嗎?想知道 Safari 是否可以運行簡單的 HTML5 聊天客戶端嗎?HTML5demos 會告訴你每一個HTML5特性在哪些瀏覽器中支持。
3、HTML5 Tracker
想了解 HTML5的最新動向嗎? 使用 HTML5 Tracker 吧,它可以跟蹤 HTML5 最新修訂信息。
4、HTML5 visual cheat sheet
想要快速超找一個標簽或者屬性嗎?看看這個非常酷的速查手冊吧,每個Web開發人員的必備。
5、Switch To HTML5
Switch To HTML5 是一個基礎而實用的模板生成工具。如果你開始一個新項目,可以到這里獲取免費的 HTML5 網站模板。
6、Cross browser HTML5 forms
HTML5 中的日歷,取色板,滑塊部件等都是非常棒工具,但是有些瀏覽器不支持。這個頁面將幫助你構建完美的HTML5表單兼容方案。
7、HTML5 Test
你瀏覽器準備好迎接 HTML5 革命了嗎?HTML5 Test 將告訴你。這個網站會為你當前使用的瀏覽器生成一份對video、audio、canvas等等特性的支持情況的完整報告。
8、Lime JS
LimeJS 是一個 HTML5 游戲開發框架,用于快速構建運行于觸屏設備和桌面瀏覽器的游戲。非常棒的HTML5開發工具,一定要用用試試。
更多內容和資訊或者問題,更多干貨分享,盡在我的個人微信公眾號,
微信名:非著名程序員,微信號:smart_android(←長按復制)。
微博:澀郎
*請認真填寫需求信息,我們會在24小時內與您取得聯系。