h5c3-pink 下

2021-05-06  本文已影响0人  monkeyfly36

HTML5新特性

语义化标签
<header>头部标签
<nav>导航栏标签
<article>内容标签
<section>区域标签
<aside>侧边栏标签
<footer>尾部标签

多媒体标签
<audio>仅支持mp3, wav, ogg
<video>仅支持mp4, webM, ogg,尽量使用mp4

input类型
A.type新增email, date, number, search等
B.属性新增required, placeholder, autocomplete(on/off), multiple(file)
注:修改placeholder

input::placeholder {
    color: red
}

CSS3新特性

1.新增选择器:
A.属性选择器

E[attr]                      /* 选择具有attr属性的元素 */
E[attr="val"]               /* 选择具有attr属性且等于val的元素 */
E[attr^="val"]             /* 选择具有attr属性且以val开头的元素 */
E[attr$="val"]             /* 选择具有attr属性且以val结尾的元素 */
E[attr*="val"]             /* 选择具有attr属性且含有val的元素 */

/* 示例 */
/* 必须是input 但是同时具有 value这个属性 选择这个元素  [] */
input[value] {
    color: pink;
}
/* 只选择 type =text 文本框的input 选取出来 */
input[type=text] {
    color: pink;
}
/* 选择首先是div 然后 具有class属性 并且属性值 必须是 icon开头的这些元素 */
div[class^=icon] {
    color: red;
}

/* !注:类选择器和属性选择器 伪类选择器 权重都是 10 */

B.结构伪类选择器
C.伪元素选择器

上一篇 下一篇

猜你喜欢

热点阅读