027 H5常用标签
只记录一下比较有趣的知识点。
一：新标签
1.选项列表datalist
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="text" list="sg">
<datalist id="sg">
<option value="apple">苹果</option>
<option value="banna">香蕉</option>
</datalist>
</body>
</html>
2.效果
3.元素分类fieldset
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<fieldset>
<legend>用户登录</legend>
用户：<input type="text"><br>
密码：<input type="password">
</fieldset>
</body>
</html>
4.效果
二：表单属性
1.placeholder
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
用户名：<input type="text" placeholder="请输入">
</body>
</html>
2.效果
3.autofocus
自动对焦
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
用户名：<input type="text" placeholder="请输入" autofocus="autofocus">
</body>
</html>
4.效果
5.multiple多选
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
上传：<input type="file" multiple>
</body>
</html>
三：多媒体标签
1.标签
embed：标签定义嵌入的内容
audio：播放音频
video：播放视频
2.内嵌式框架iframe
先上传，然后使用分享
代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<iframe height=498 width=510 src='http://player.youku.com/embed/XNDI1MTE4MjEzNg==' frameborder=0 'allowfullscreen'></iframe>
</body>
</html>
效果：
3.audio
支持ogg，mp3，wav格式
autoplay：自动播放
loop：循环
controls：控制
4.案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<audio autoplay controls loop>
<source src="anangel.mp3"></source>
<!-- <source src="单身情歌.wav"></source> -->
</audio>
</body>
</html>
效果：
5.video
支持ogg，peeg4,webm
027 H5常用标签的更多相关文章
- h5常用标签语义
<article>定义页面独立的内容区域.例如外部来的文章. <aside>定义页面的侧边栏内容.<aside> 标签定义 <article> 标签外的 ...
- 04. H5标签有哪些？行内元素有哪些？块级元素有哪些？空(void)元素有哪些？行内元素和块级元素有什么区别？你工作中常用标签有什么？
4. H5标签有哪些? 2)行内元素有哪些? a - 锚点 em - 强调 img - 图片 font - 字体设定 ( 不推荐 ) i - 斜体 input - 输入框 3)块级元素有哪些? add ...
- HTML常用标签
HTML常用标签: HTML文档格式: 首先,HTML是一种超文本标签语言,它是制作网页的基础. 其次,HTML文档中至少包含基本的和成对的<html> </html>.< ...
- html常用标签介绍
常用标签介绍 文本 最常用的标签可能是<font>了,它用于改变字体,字号,文字颜色. 点击查看效果 <font size="6">6</font&g ...
- HTML-学习笔记（常用标签）
本篇博客讲一讲HTML中的标签 HTML 标题 标题(Heading)是通过 <h1> - <h6> 等标签进行定义的.<h1> 定义最大的标题.<h6> ...
- dedecms 常用标签调用
/*------------------单个ip调用-------------------*/ {dede:type typeid="12"} <a title=" ...
- 三、Html常用标签
1,基本标签 <html>:html文档的根元素,可以指定一个xmlns属性,值只能是http://www/w3.org/1999/xhtml. <body>:页面主体部分 & ...
- 0426html常用标签属性
一.基础语法 标签:作为网页的最小单元 1.双标签 内容的容器 2.单标签 控制性内容 注释 每一个模块都要写清楚注释 二.基本结构 <!DOCTYPE html> ...
- html常用标签学习笔记
本文内容: 前言:本文讲述的内容包括几类常用标签,以及这些标签的一些常用属性(有一些属性由于已经有CSS样式来代替,所以对于一些不重要的这里选择不讲) 排版标签 段落标签:p div span 标题标 ...
随机推荐
- 最新my.cnf可用于5.6&5.7
[MySQL]prompt = [\\u@\\h][\\d]>\\_ #自定义登录提示信息 [mysqld]#基本设置#user = mysql #用户名sql_mode =“STRICT_T ...
- python---Numpy模块中线性代数运算，统计和数学函数
NUMPY告一段落,接下来,进入pandas. import numpy as np # Numpy 线性代数运算 # Numpy 统计和数学函数 print('==========计算矩阵与其转置矩 ...
- jupytext library using in jupyter notebook
目录 1. jupytext features 2. Way of using 3. usage 4. installation 1. jupytext features Jupytext can s ...
- idea添加tomcat和服务添加项目
- char[] byte[] string
C# byte 和 char 可以认为是等价的.但是在文本显示的时候有差异. char 占两个字节,unicode字符 1.内存转换: char转化为byte: public static byte ...
- CS229开源项目
斯坦福大学CS 229机器学习备忘单: https://github.com/kaobeixingfu/stanford-cs-229-machine-learning CS229机器学习算法的Pyt ...
- Cookie实现记住密码代码
jsp页面 <%-- Created by IntelliJ IDEA. User: 60590 Date: 2019/11/28 Time: 14:10 To change this temp ...
- Linux命令：awk求和、平均值、最大最小值
本文链接:https://blog.csdn.net/wyqwilliam/article/details/825600431.求和cat data|awk '{sum+=$1} END {print ...
- EL运算符和基本运算
1.EL存取器:.和[] ${applicationScope.list[].name} 获取applicationScope中list集合的第二个元素的name属性. 2.三元运算符: ${> ...
- Session的应用——三天免登录
1.使用Cookie实现的登录的不足: protected void doGet(HttpServletRequest request, HttpServletResponse response) t ...