背景
制作h5页面的自适应宽度按钮，开始使用背景图制作，把按钮两端切出来，中间区域单独切出来宽一像素图沿x轴重复，但在不同客户端浏览器表现不一致（遇到的是android的某款机型显示有问题，大概用图片仍可以调好，没做尝试），之后考虑直接用css写按钮效果
实现过程中遇到的问题
关于阴影部分
使用box-shadow属性设置内阴影、外阴影、内发光、外发光
语法1
box-shadow: h-shadow(必需) v-shadow(必需) blur(可选) spread(可选) color(可选) inset(可选);
可以用逗号分隔阴影列表设置多个阴影叠加效果，层级关系位置越靠前面的显示层级越高，例如：1
box-shadow: 0px 0px 0px 10px #f00, 0px 0px 0px 20px #fc0, 0px 0px 0px 30px #ff0, 0px 0px 0px 40px #0f0, 0px 0px 0px 50px #0fe, 0px 0px 0px 60px #00f, 0px 0px 0px 70px #f0f;
关于阴影使用了混合模式，正片叠底和滤色等
阴影颜色使用了正片叠底，暂时是使用了叠完之后的颜色做为阴影颜色==
如果是元素,可以使用CSS3新特性: mix-blend-mode
文档描述为：
mix-blend-mode CSS 属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合。
扩展：
1.CSS3混合模式mix-blend-mode/background-blend-mode简介
2.https://developer.mozilla.org/zh-CN/docs/Web/CSS/mix-blend-mode
关于自适应
h5页面css设置属性值单位的问题，px，rem，em，百分比
对于一个固定可自动缩放模块，如果可以使用百分比，优先使用百分比。内部如果font-size值不会受影响可以使用em，如果font-size值不确定，可以使用rem，对于不期望随着模版放大缩小改变的单位使用px。
关于伪类选择器中文乱码的问题
确保html文件编码和css文件编码保持一致。最好使用utf-8编码。在css文档头加入 @charset "utf-8";（不声明的话会默认为ansi编码）。伪类选择器中的中文可以使用中文对应的Unicode，需要注意Unicode在CSS中的书写方式。
英文字符不要转换为Unicode，会被转成实体字符
例如：”更多>”
对应的Unicode：\u66f4\u591a\u0026\u0067\u0074\u003b
对应的UTF-8：更多>
伪类选择器中 使用 content: '\66F4\591A>';
转换工具：http://tool.chinaz.com/tools/urlencode.aspx
参考及扩展：
1.http://www.w3school.com.cn/cssref/pr_box-shadow.asp
2.字符编码笔记：ASCII，Unicode 和 UTF-8
3.ASCII，Unicode和UTF-8