HTML5与CSS3权威指南笔记案例1

HTML5与CSS3权威指南笔记案例1_第1张图片
标题图

第1章

完成图片中的代码


 Search 

完成图片中的代码




 Username 


第2章

HTML5与CSS3权威指南笔记案例1_第2张图片
完成图片中的代码


HTML5

我是达叔
你好呀

HTML5与CSS3权威指南笔记案例1_第3张图片
完成图片中的代码



contentEditable列表

可编辑的列表项

  • 列表项1
  • 列表项2
  • 列表项3
HTML5与CSS3权威指南笔记案例1_第4张图片
完成图片中的代码



article元素

Spinner

HTML5与CSS3权威指南笔记案例1_第5张图片
完成图片中的代码



section元素

达叔

dashucoding,你好啊

HTML5与CSS3权威指南笔记案例1_第6张图片
完成图片中的代码



section下article元素

达叔

dashucoding,你好啊

达叔

达叔好啊

HTML5与CSS3权威指南笔记案例1_第7张图片
完成图片中的代码



包含article元素的section元素

达叔

dashucoding

哈哈哈哈哈哈哈

HTML5与CSS3权威指南笔记案例1_第8张图片
完成图片中的代码



nav元素


达叔小生

HTML5与CSS3权威指南笔记案例1_第9张图片
完成图片中的代码



文章内的aside元素


H1

达叔h1

哈哈哈哈

HTML5与CSS3权威指南笔记案例1_第10张图片
完成图片中的代码



aside元素


putdatetime结合使用

HTML5与CSS3权威指南笔记案例1_第11张图片
完成图片中的代码



putdate与time

h1的苹果

dashu

正文

多个header元素

HTML5与CSS3权威指南笔记案例1_第12张图片
完成图片中的代码



多个header元素

h1网页标题

header的h1文章中article的标题

p标签正文

header元素

HTML5与CSS3权威指南笔记案例1_第13张图片
完成图片中的代码



header元素

文章标题h1

文章正文

hgroup元素

HTML5与CSS3权威指南笔记案例1_第14张图片
完成图片中的代码



hgroup元素

文章主标题h1

文章子标题h2

文章正文

添加footer元素

HTML5与CSS3权威指南笔记案例1_第15张图片
完成图片中的代码



添加footer元素

文章内容article
文章的脚注footer

address元素

完成图片中的代码



address元素

个人博客 博客园 掘金:

网页

HTML5与CSS3权威指南笔记案例1_第16张图片
完成图片中的代码


  网页
  



网页标题

文章主标题

文章子标题

文章正文

评论标题

评论正文

版权所有

form属性

HTML5与CSS3权威指南笔记案例1_第17张图片
完成图片中的代码


  form属性示例
  


往后余生,唯独有你
作者:达叔小生
90后帅气小伙,良好的开发习惯;独立思考的能力;主动并且善于沟通
博客: https://www.jianshu.com/u/c785ece603d1

结语

  • 下面我将继续对 其他知识 深入讲解 ,有兴趣可以继续关注
  • 小礼物走一走 or 点赞

你可能感兴趣的:(HTML5与CSS3权威指南笔记案例1)