初学HTML5技术,有这些网站就够了

初学HTML5技术,有这些网站就够了,第1张

HTML5基础知识网站

1.W3C

全称“W3School”,简直是学习网站中的“战斗机”,每一节都有学生时代老师般的“板书”,丰富的实例展示,还有工具书、小测验等提升工具,私教般的存在!

2.Dive into HTML5

这个网站几乎都是关于HTML5的文档,讲一些很基础的知识,简洁清新。如果想学习HTML5的同时提高英语阅读能力,这个网站是极好的。类似的英文网站还有woorkup。

3.h5之家

除了丰富且与时俱进的教程,这个网站还有很多关于HTML5业界的独特见解,闲暇时候看看,拓展知识又能在人前装X,这样的网站哪里找!

HTML5案例网站

1.HTML5xCSS3

拥有超丰富的HTML5案例和模板,随便点开一个案例都好看到让人震惊。里面的全部都是HTML5响应式网站哟!

2.360html5基地

350旗下的HTML5作品展示网站,大部分是HTML5游戏展示,可爱有趣。比如打开一个割绳子的HTML5展示:

3.HTML5 Games

相对360来说更丰富的HTML5游戏资源,玩着玩着技能激发设计灵感呢!

HTML5技术网站

1.whatwg

网络超文本应用技术工作小组(Web Hypertext Application Technology Working Group)的博客,里面一些文章能让人受益匪浅。

2.HTML5医生

一些关于html5语义及如何使用它们的文章,医生会定时回答网友们的问题。

3.HTML5中国

一个真的能手把手教你6小时做一个HTML5坦克大战游戏的网站,还有各类HTML5的资讯、沟通交流论坛等。

HTML5测试网站

1.HTMLDemos

测试HTML5标签在各浏览器的兼容性,还能查看各种HTML5的标准Demo演示。

2.html5 test

能为浏览器对HTML5的兼容性打分,可以知道你当前的浏览器对HTML5的支持情况如何,各种标签和组件的支持情况。

所以,网站已经分享给你们了,如果真心要学习此项技能,快去实践吧!

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>New Document</title>

<meta name="generator" content="EverEdit" />

<meta name="author" content="lglong519" />

<style>

table{text-align: center}

table b{padding:2px 5pxborder-radius:3pxcolor:#fff}

table td{width:100pxheight:50px}</style>

</head>

<body>

<table cellspacing='10'>

<tr>

<td></td>

<td><b>IS</b></td>

<td><b>DID</b></td>

<td><b>CAN</b></td>

<td><b>WILL</b></td>

<td><b>WOULD</b></td>

<td><b>MIGHT</b></td>

</tr>

<tr>

<td><b>WHO</b></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>

<tr>

<td><b>HWAT</b></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>

<tr>

<td><b>WHERE</b></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>

<tr>

<td><b>WHEN</b></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>

<tr>

<td><b>WHY</b></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>

<tr>

<td><b>HOW</b></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

<td></td>

</tr>

</table>

</body>

<script type="text/javascript">

var table=document.getElementsByTagName("table")[0]

for (var i=0i<table.rows.lengthi++){

var cs=table.rows[i].cells

for (var n=0n<cs.lengthn++){

var color="rgb("+Math.round(43+(204-43)/(cs.length-1)*n)+"," +Math.round(95+(27-95)/(cs.length-1)*n)+"," +Math.round(95+(57-95)/(cs.length-1)*n)+")"

if(i!=0&&n!=0){

cs[n].style.backgroundColor=color

}

if(cs[n].getElementsByTagName("b")[0]){

cs[n].getElementsByTagName("b")[0].style.backgroundColor=color

}

}

}

</script>

</html>

跟你的参考图差不多了

1、w3schools:w3schools是一个免费的在线编程学习网站,它提供了很多关于HTML、CSS、JavaScript、SQL、PHP、Python、jQuery等的入门教程和参考手册,非常适合初学者学习。

2、Codecademy:Codecademy是一个在线编程学习网站,提供了很多关于HTML、CSS、JavaScript、jQuery、PHP、Python等的入门教程和实践练习,非常适合初学者学习。

3、Treehouse:Treehouse是一个在线编程学习网站,提供了很多关于HTML、CSS、JavaScript、jQuery、PHP、Python等的入门教程和实践练习,非常适合初学者学习。

4、Code Avengers:Code Avengers是一个在线编程学习网站,提供了很多关于HTML、CSS、JavaScript、jQuery、PHP、Python等的入门教程和实践练习,非常适合初学者学习。

5、CodePen:CodePen是一个在线编程编辑器,支持HTML、CSS、JavaScript、jQuery等语言,非常适合初学者练习和实践。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/8372930.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-15
下一篇 2023-04-15

发表评论

登录后才能评论

评论列表(0条)

保存