HTML CSS整理笔记(二)列表、表格、媒体元素

作者: web 发布时间: 2019-11-08 浏览: 1685 次 编辑

完成笔记链接:https://www.niwoxuexi.com/blog/web/article/1245

——2 列表、表格、媒体元素——

17.三种列表:

(1)有序列表<ol><li>

(2)无序列表<ul><li> ul中只能嵌套li,而li可以嵌套任意标签。

(3)定义列表<dl><dt><dd> 是标题及列表项的结合。

18.表格基本结构:单元格、行、列

(1)<table><tr><th><td>

(2)HTML5中已废除table的border属性,用css控制边框宽度。

(3)跨列(横跨):<td colspan="所跨的列数">内容</td>

跨行(竖跨):<td rowspan="所跨行数">内容</td>,两者都要删除被合并的其他单元格。

(4)表格特点:同行单元格高度一致且水平对齐,同列单元格宽度一致且垂直对齐。

19.视频元素:

(1)controls属性提供播放暂停和音量控件、autoplay属性自动播放、loop属性循环播放

<video src="视频路径" controls="controls">你的浏览器不支持video标签</video> 

(2)source元素链接不同的视频文件,浏览器会自动选择第一个可识别的格式:

<video controls> <source src="video/video.webm" /> <source src="video/video.mp4" />你的浏览器不支持video标签 <video> 

20.音频元素:使用语法和视频元素一样,只要把video换成audio即可。

21.HTML5的结构元素(先划分结构再写内容):

  • header(头部)、footer(脚部)、
  • section(独立区域)、article(独立文章内容)、
  • aside(相关内容或应用,常用于侧边栏)、nav(导航类辅助内容)

22.<iframe>框架:方便在页面中引用站外的页面内容。

<iframe name="此框架的标识名" src="引用的页面地址"></iframe> 

23.<iframe>和锚链接的结合:使锚链接的内容在iframe框架中打开

<iframe name="mainFrame" src="框架引用的页面地址" /> <a href="链接路径" target="mainFrame">点击在框架中打开</a>


HTML CSS整理笔记更多笔记

HTML CSS整理笔记(一)HTML5基础

HTML CSS整理笔记(二)列表、表格、媒体元素

HTML CSS整理笔记 (三)表单

HTML CSS整理笔记(四)CSS3基础

HTML CSS整理笔记(五) CSS3美化网页

HTML CSS整理笔记(六)盒子模型

HTML CSS整理笔记 (七) 浮动

HTML CSS整理笔记 (八) 定位网页元素

HTML CSS整理笔记 (九) CSS3做网页动画

HTML CSS整理笔记 (十)HTML部分