這是第一周的訓(xùn)練內(nèi)容
- 請(qǐng)認(rèn)真閱讀以下教程并操作
- 作業(yè)以博客形式提交稀拐,將寫(xiě)好的博客內(nèi)容投稿至本專(zhuān)題,文章標(biāo)題以[W1]開(kāi)始
- 截止日期:2017年4月7日
目標(biāo)
- 學(xué)會(huì)使用HTML和CSS制作頁(yè)面并對(duì)其進(jìn)行布局
學(xué)習(xí)內(nèi)容
- 了解HTML俗冻,使用HTML制作一個(gè)簡(jiǎn)單的頁(yè)面
- 學(xué)習(xí)常用的HTML標(biāo)簽
- 了解CSS,并將CSS運(yùn)用于HTML之中
- 了解CSS的作用和優(yōu)勢(shì)
- 學(xué)習(xí)CSS基礎(chǔ)語(yǔ)法
- 學(xué)習(xí)“選擇器”
- 了解可以操作、修改HTML的哪些樣式(底色屋剑、邊框、布局等)
- 使用css的偽元素
- 用CSS對(duì)頁(yè)面進(jìn)行布局
- 理解為什么不使用Table對(duì)頁(yè)面布局
學(xué)習(xí)資源
- html在線驗(yàn)證:http://www.freeformatter.com/html-validator.html (該網(wǎng)站上還有很多別的工具)
- html在線格式化代碼:http://www.cleancss.com/html-beautify/
- W3School上的HTML基礎(chǔ)教程:http://www.w3school.com.cn/html/index.asp
- Html5新特性(了解即可):http://www.w3school.com.cn/html5/index.asp
- CodeForDream上提供的HTML課程:http://www.codefordream.com/courses/html_basic/sections
- CSS在線驗(yàn)證: http://codebeautify.org/cssvalidate (該網(wǎng)站上還有很多別的工具)
- 學(xué)習(xí)CSS布局:http://learnlayout.com/
- CSS基礎(chǔ)教程:http://www.w3school.com.cn/css/index.asp
- CSS3新特性(了解即可):http://www.w3school.com.cn/css3/
- CodeForDream上提供的CSS課程:http://www.codefordream.com/courses/css_basic/sections
作業(yè)
-
詳細(xì)說(shuō)明下圖中的列表是如何實(shí)現(xiàn)的
題1 -
詳細(xì)說(shuō)明下圖中的表格是如何實(shí)現(xiàn)的
題2 -
只使用HTML實(shí)現(xiàn)下面的頁(yè)面诗眨,內(nèi)容必須相同唉匾,樣式可以不同
題3 -
使用CSS美化上一題的頁(yè)面,圖片供參考
題4