1、html5 最新版本;
canvas、svg、数据交互、css3动画效果、css3选择器;
2、h5 结构标签
- header 头部标签
- section 板块标签
- nav 导航栏
- footer 页脚
- aside 侧边栏,轮播图,nav导航栏
3、语义化标签
- article 文章标签或内容标签
- hgroup 标题组的标签
- time 表示时间或日期的标签
- address 地址标签
- mark 标记标签
4、颜色:
- rgb
- rgba
- #fff
- pink,yellow,blue
颜色 HSL(色彩模式)
- h:hue 色调
- S:Saturation 饱和度
- L:Lightness 明度(纯度)
background-color:hsl(0,100%,50%); 红色
background-color:hsl(360,100%,50%); 红色
background-color:hsl(120,100%,50%); 绿色
background-color:hsl(240,100%,50%); 蓝色
5、currentColor:当前颜色
当前颜色以color字体颜色为标准
6、文字阴影
- x-shadow 水平的偏移量负值的时候水平偏左移动正值的时候水平偏右移动
- y-shadow 垂直的偏移量正值的时候垂直偏下移动负值的时候垂直偏上移动
- blur 模糊的半径
- spread 阴影的尺寸大小
- color 阴影的颜色
text-shadow:0 0 10px cyan,5px 5px 10px #c0f,-5px -5px 10px #c0f;
火焰字
<style>
.fire{
font-size:40px;
font-weight:bold;
background:#000;
text-align:center;
padding:24px;
text-shadow:0 0 4px white,
0 -5px 4px #ff3,
3px -10px 6px #fd3,
-3px -15px 11px #C90,
3px -25px 18px #f20;
/* 4px -35px 28px #C30;*/
}
</style>
<body>
<p class="pubsty fire">我是凯迪 ,么么哒!!!</p>
</body>
7、meter 进度条
<meter max='100' min='0' value='80' low='30' high='80'></meter> 绿色
<meter max='100' min='0' value='90' low='30' high='80'></meter> 黄色
<meter max='100' min='0' value='90' low='80' high='30'></meter> 红色