A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© chenau 初级黑马   /  2019-4-9 20:23  /  967 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

知识小结
1.        h5新增语义化标签:
<header> <nav><article><section><footer>
2.        新增多媒体标签:
音频:<audio>  (音频常用于游戏页面、宣传页面,加背景音乐,某些浏览器不支持自动播放格式)
语法格式:<audio src=”文件地址” controls=”controls”  autoplay=”autoplay” loop=”loop”></audio>
           <audio controls=”controls”>
            <source src=”sonw.mp3” type=”audio/mpeg”>
<source src=”sonw.ogg” type=”audio/ogg”>
         </audio>

视频<video>
语法格式:<video src=”文件地址” muted=”muted” poster=”poster” controls=”controls”  autoplay=”autoplay” loop=”loop”></video>
(谷歌浏览器不能自动播放视频,添加muted可以)
           <video controls=”controls” width=”200”>
            <source src=”sonw.mp4” type=”video/mp4”>
<source src=”sonw.ogg” type=”video/ogg”>
         </vedio>
3.        新增Input表单
<input type=”email”>       
<input type=”number”>
<input type=”tell”>
<input type=”search”>
<input type=”url”>
<input type=”date”>
新增表单属性:
Required=”required”内容必填
Placeholder=”提示文本” 占位符
Autofocus=”autofocus”自动获得焦点
Autocomplete=”on/off”自动记录输入的内容(需要同时在表单添加name属性)
Multiple=”multiple” 可以选择多个文件

4.        Css3选择器
属性选择器:
E[att]选择有att属性的E元素
E[att=”val”]
E[att^=”val”]选择以val开头的标签
E[att$=”val”]选择以val结束的标签
E[att*=”val”]选择有val内容的标签
结构伪类选择器:
(不考虑类型,指定父元素)
E:first-child匹配父元素中的第一个子元素
E:nth-child()  n可以是数字,关键词(odd/even),公式(2n,2n+1,5n,n+5,-n+5)(从0开始)
(指定同一类型的子集)
E:first-of-type匹配指定类型E的第一个元素
E:nth-of-type()

伪元素选择器:(属于行内元素,设置大小时需转化成块级元素,权重为1)
E::before
E::after {
    content:””;(content不能省略,可以设置为空)

5.2D转换
转换(transform)可以实现元素的位移、旋转、倾斜、缩放(对块级标签有效果,行内标签没有效果)
Transform: translate(x,y);(x,y可以是具体的像素值,还可以是百分比(是自身宽度或高度的百分比))
Transform: translateX();  Transform: translateY();(可以只移动X或Y轴)
Transform: rotate;
Transform: skew;
Transform: scale;

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马