在开发网页的时候，由于浏览器的差异，会造成css 代码需要写不同的样式，才能适配大部分浏览器，这很烦，但是又不得不做，我把其中用得比较多的那些，做了一个归纳，放在这里，开发的时候，直接打开这里，复制粘贴就可以了，不必去百度或者谷歌查那些代码，这样可以节省一部分时间；

1. 其中个人用的比较多的，有以下这些：

border-radius
box-sizing
box-shadow

这里只是一部分，后续遇到了，再继续更新：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

        div.abox {

            position: relative;

            margin: 100px auto;

            width: 200px;

            height: 200px;

            background: #ff0000;

            border: 1px solid #eee;

            border-radius: 50%;

            -webkit-border-radius: 50%;

            -moz-border-radius: 50%;

            -ms-border-radius: 50%;

            -o-border-radius: 50%;

            box-sizing: border-box;

            -moz-box-sizing: border-box;

            -webkit-box-sizing: border-box;

            -o-box-sizing: border-box;

            -ms-box-sizing: border-box;

            box-shadow: 0px 0px 20px #000;

            -webkit-box-shadow: 0px 0px 20px #000;

            -moz-box-shadow: 0px 0px 20px #000;

            filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=135, Strength=5);

            /*for ie6,7,8*/

            -moz-box-shadow: 2px 2px 5px #969696;

            /*firefox*/

            -webkit-box-shadow: 2px 2px 5px #969696;

            /*webkit*/

            box-shadow: 2px 2px 5px #969696;

            /*opera或ie9*/

        }

    </style>

</head>

<body>

    <div class="abox">    </div>

</body>

</html>

效果图：

　　　　

2. 修改input 框中的placeholder 的样式：下面以字体颜色为例，当然还可以修改大小，位置等等

/*修改提示文字的颜色*/

input::-webkit-input-placeholder { /* WebKit browsers */

    color: red;

} 

input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

    color: red;

} 

input::-moz-placeholder { /* Mozilla Firefox 19+ */

    color: red;

} 

input:-ms-input-placeholder { /* Internet Explorer 10+ */

    color: red;

}

微信内部接口：

weixin://dl/business/?ticket=怎么生成获取的?微信接口api公开

weixin://dl/business/?ticket=  到底怎么生成的？调用以下接口

weixin://dl/scan 扫一扫
weixin://dl/feedback 反馈
weixin://dl/moments 朋友圈
weixin://dl/settings 设置
weixin://dl/notifications 消息通知设置
weixin://dl/chat 聊天设置
weixin://dl/general 通用设置
weixin://dl/officialaccounts 公众号
weixin://dl/games 游戏
weixin://dl/help 帮助
weixin://dl/feedback 反馈
weixin://dl/profile 个人信息
weixin://dl/features 功能插件

关于css 的兼容设置 ----笔记的更多相关文章

  1. IE 兼容问题笔记

    IE 兼容问题笔记 解决IE11兼容HTML5 设置 document.body的一些用法以及js中的常见问题 flex布局浏览器兼容处理 ie8, ie9 css3 media媒体查询器用法总结 c ...

  2. ie6,ie7,ie8 css bug兼容解决记录

    ie6,ie7,ie8 css bug兼容解决记录 转载自:ie6,ie7,ie8 css bug兼容解决记录 - 前端开发 断断续续的在开发过程中收集了好多的bug以及其解决的办法,都在这个文章里面 ...

  3. css样式兼容不同浏览器问题解决办法

    在网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网乱可能出去不想出现的效果! 所 有浏览器 ...

  4. CSS权威指南学习笔记系列(1)CSS和文档

    题外话:HTML是一种结构化语言,而CSS是它的补充:这是一种样式语言.CSS是前端三板斧之一,因此学习CSS很重要.而我还是菜鸟,所以需要加强学习CSS.这个是我学习CSS权威指南的笔记,如有不对, ...

  5. 最全的CSS浏览器兼容问题（转至http://68design.net/Web-Guide/HTMLCSS/37154-1.html）

    最全的CSS浏览器兼容问题   CSS对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2 ...

  6. css js 兼容问题

    js  兼容问题 1. document.form.item 问题问题:代码中存在 document.formName.item("itemName") 这样的语句,不能在FF下运 ...

  7. 最全的CSS浏览器兼容问题http://www.68design.net/Web-Guide/HTMLCSS/37154-1.html

    最全的CSS浏览器兼容问题 来源:68design.net 作者:邓飞飞 2008年09月23日 14:17 网友评论:7条 点击:71865 CSS 对浏览器的兼容性有时让人很头疼,或许当你了解当中 ...

  8. CSS中兼容的一面-----Hack

    国庆了,出去玩耍,也有好长时间没有更新博客了.. 今天就和大家共享一篇技术博文吧.. CSS中兼容的一面-----Hack技术大全 兼容范围: IE:6.0+,FireFox:2.0+,Opera 1 ...

  9. IE6/IE7/IE8/Firefox/Chrome/Safari的CSS hack兼容一览表

    浏览器兼容问题一直是前段开发工程师比较头痛的问题,熟悉了里面的规则也就变得简单了,这里有一份资料可以分享给大家,大家平时开发过程中遵循这个规律的话,会变得轻松多了: 各浏览器CSS hack兼容表: ...

随机推荐

  1. c# Linq&Lambda

    0.写这个文章主要记录下常用Lambda的用法,能力有限,文中有问题的地方希望各位大神指出来谢谢!因为平时写代码的时候没有特地去用lambda,全是用一些循环,少量会用到lambda,虽然也能实现要的 ...

  2. Linux atop监控说明

    2017-02-22 09:42 by pursuer.chen, 7060 阅读, 2 评论, 收藏, 编辑 介绍 atop是一个功能非常强大的linux服务器监控工具,它的数据采集主要包括:CPU ...

  3. jquery 一键复制文本到剪切板

    <a id="copy" data-clipboard-text="123456">复制文本</a> $(function(){ var ...

  4. Spring Boot - AOP（面向切面）

    AOP 全称 Aspect Oriented Programming(面向切面),AOP主要实现的目的是针对业务处理过程中的切面进行提取,它所面对的是处理过程中的某个步骤或阶段,以获得逻辑过程中各部分 ...

  5. ubuntu16.04 pycharm的安装

    Ubuntu 16.04安装PyCharm-Python IDE (转:http://www.linuxdiyf.com/linux/26442.html) 我最开始接触的编程语言是C/C++,之后由 ...

  6. obtainFreshBeanFactory()源码探究

    该方法目的是获取bean工厂.主要逻辑是:刷新bean工厂,获取bean工厂,进而返回bean工厂,但实际上并没有刷新bean工厂,基本上为空实现.源码如下: 而刷新bean工厂,正如注释所说,do ...

  7. Zabbix调优不完全指南(https://www.jianshu.com/p/2d911d55448f)

    从学习搭建zabbix到完成各类监控.调优.二次开发已经过去了两年,期间通过QQ学习群.zabbix官方社区.各个技术博客整理学习了不少关于各种报错的处理方法,现在将常见的一些报错处理方法整理出来分享 ...

  8. PVID和VID彻底研究（上） ——PVID的作用及和VID的区别

    http://blog.csdn.net/cybertan/article/details/8348752 另外一篇 netgear的官方文档: http://club.netgear.cn/Know ...

  9. Mysql8.0导入数据时出错

    在Windows操作系统下,使用命令行将已经创建好的txt文件导入到mysql的pet表中. 出现ERROR 1148 (42000): The used command is not allowed ...

  10. case class 和class的区别以及构造器参数辨析

    工作中偶然发现Scala构造方法中的参数,无论是否有val/var修饰都可以顺利编译运行,如下: class AA(name: String) class BB(val name: String) 那 ...