目录
1.区域内文字不会被选中
2.textarea标签去掉右下角的斜线
3.浏览器对css样式的兼容性（eg:透明度、变形、过渡）
4.图片添加白边的显示效果
5.实现同一行中图片和文本垂直居中
--------------------------------------------------------------------
1.区域内文字不会被选中
要注意浏览器的兼容性：
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
2.textarea标签去掉右下角的斜线
resize:none;
3.浏览器对css样式的兼容性（透明度、变形、过渡）
浏览器 前缀
IE和safari -webkit-
Chrome -ms-
Firefox -moz-
举例：
透明度：
opacity: 0.8;
filter: alpha(opacity = 80);
变形：
transform:rotate(7deg); -ms-transform:rotate(7deg); /* IE 9 */ -moz-transform:rotate(7deg); /* Firefox */ -webkit-transform:rotate(7deg); /* Safari 和 Chrome */ -o-transform:rotate(7deg); /* Opera */
过渡：
transition:width 2s;-moz-transition:width 2s; /* Firefox 4 */-webkit-transition:width 2s; /* Safari and Chrome */-o-transition:width 2s; /* Opera */4.图片添加白边的显示效果
原图：
加工后：
大致的效果可以出现
border:10px solid white;
background: black;
transform: rotate(45deg);
原理：设置白色边框和黑色背景
问题：但是不知道为什么，图片正常情况下（不设置旋转）背景效果失效，在设置了旋转（transform:rotate())后效果出来了
5.实现同一行中图片和文本垂直居中
为图片和文本都设置vertical-align：middle
