文档章节

学习01-html(新增语义化标签,多媒体标签,表单属性)

宋_
 宋_
发布于 02/27 17:52
字数 698
阅读 103
收藏 0

新增语义化标签

header

头部标签

nav

导航栏标签

article

内容标签

section

块级标签

aside

侧边栏标签

footer

尾部标签

多媒体标签

audio音频

三总音频格式

Ogg vorbis;
Mp3;
Wav;

属性

autoplay

autoplay

如果出现该属性则音频在就绪后 马上播放

controls

controls

如果出现该属性,则像用户显示控件,比如按钮播放

loop

loop

如果出现该属性,则每当音频结束时重新开始播放

src

url

要播放的音频的URL

语法

单个文件语法

<audio src="audio/01.mp3" controls="controls" controls></audio>

多个播放设置

    <audio controls="controls">
        <source src="mp3路径地址" type="audio/mpeg">
        <source src="ogg路径地址" type="audio/ogg">
    </audio>

video视频

三种视频格式

Ogg;
MPEG4;
WebM;

属性

autoplay

autoplay

视频就绪自动播放

controls

controls

向用户显示控件播放

width

pixels(像素)

设置播放器宽度

height

pixels(像素)

设置播放器高度

loop

loop

播放完是否继续播放该视频,循环播放

preload

proload || auto(预先加载视频) || none(不应加载视频)

规定是否预加载视频(如果有了autoplay就忽略该属性)

src

url

视频url地址

poster

imgurl

加载等待的画面图片

muted

muted

静音播放

语法

单个语法

<video src="文件地址" controls="controls"></video>

多个播放

    <video controls="controls">
        <source src="audio/video.mp4" type="video/mp4">
        <source src="audio/01.ogg" type="video/ogg">
    </video>

表单属性

type

email

限制用户输入必须为Email类型

url

限制用户必须为URL类型

date

限制用户输入必须为日期类型

time

限制用户输入必须为事件类型

month

限制用户必须为月类型

week

限制用户输入必须为周类型

number

限制用户输入必须为数字

tel

手机号码

search

搜索框

color

生成颜色选择表单

表单属性

required

required

表单拥有该属性表示其内容不能为空,必填

placeholder

提示文本

表单的提示信息,存在默认值将不显示

autofocus

autofocus

自动聚焦属性,页面加载完成自动聚焦到指定表单

autocomplete

off / on

当用户在字段开始键入时,浏览器基于之前键入过的值,应该显示出在字段中填写的选项 默认已经打开,如autocomplete=“on” 关闭autocomplete=“off” 需要放在表单内同时加上name属性 同时成功提交

multiple

multiple

可以多选文件提交

 

 

 

 

 

 

 

© 著作权归作者所有

宋_
粉丝 2
博文 66
码字总数 19036
作品 0
吕梁
私信 提问
加载中

评论(0)

2017.12.1-学习笔记:html基础知识点整理

超文本标记语言 HTML hyper text markup language 1.浏览器内核有哪些? 浏览器 内核 IE trident edge edgeHTML firefox gecko Safari webkit Chrome blink Opera presto 2.网页组成的三部分......

演员小新
2017/12/01
0
0
HTML标签学习记录

序言 整理谷歌的小弟的笔记,版权归原作者所有,本文仅作整理,原文链接:http://blog.csdn.net/lfdfhl/article/list/2 常用标签 p标签 p标签在HTML中常用于表示段落,它是英文单词paragraph...

在代码下成长
2017/12/14
0
0
一周一章前端书·第13周:《HTML与CSS进阶教程》S01E02

第2章 语义化 2.1 语义化简介 HTML的精髓在于标签的语义。大部分标签都有它自身的语义,比如标签,表示paragraph,一个段落;,表示header level 1,一级标题。 前端的三大核心技术HTML、CSS...

梁同学de自言自语
2018/01/13
0
0
从零开始学 Web 之 HTML5(一)HTML5概述,语义化标签

大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:http://www.cnblogs.com/lvonve/ CSDN...

Daotin
2018/07/24
0
0
三天熟练掌握HTML5和CSS3

三天熟练掌握HTML5和CSS3 1.认识html5 HTML5并不仅仅只是作为HTML标记语言的一个最新版本,更重要的是它制定了Web应用开发的一系列标准,成为第一个将Web做为应用开发平台的HTML语言 HTML5定...

JSON_P
2016/09/28
99
0

没有更多内容

加载失败,请刷新页面

加载更多

一名时尚艺术家转行到科技行业的历程

Serverless 团队新成员 Charmmie 是从高级时装行业转行到技术领域的,本文是她的故事,太酷了。 我是一名艺术家、时尚行业从业者。讲真的,我从没想过自己有一天会像现在这样,坐在旧金山一家...

腾讯云Serverless
35分钟前
29
0
[算法] 刷题-数据结构

索引 最小栈 全O1结构 LRU 题解 最小栈 class MinStack: def __init__(self): """ initialize your data structure here. """ self.stack = list() ......

a_zphoenix
37分钟前
29
0
发现 | 友信金服旗下好分期违规套路贷,资金端人人贷会何去何从?

来源 | 复利频道 作者 | 赛闻 去年,P2P网贷行业曾因资产端涉及严重套路贷等问题,被监管进行了严厉打击。这导致多家P2P平台,例如花生米富、金蛋理财发生爆雷,前者高管目前仍在拘押中,后者...

镭射财经
40分钟前
34
0
python3 的tkinter和pygame自制音乐播放器的程序解析

感谢作者分享-http://bjbsair.com/2020-04-07/tech-info/30780.html 1.说明: 1.1 推荐环境:python3.8、微软vscode编辑器、pygame模块 1.2 熟悉tkinter的相关布局,gif导入、图片导入、路径...

曹长卿
49分钟前
21
0
Gson的使用和注解

目前比较流行的处理json数据的工具是Jackson和Fastjson,只有少数的公司使用Gson(一些公司对外部插件的安全性要求问题,如某些银行),这里对Gson的使用作个记录。 1、引进Gson jar包 <dep...

Lion华
49分钟前
32
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部