zoukankan      html  css  js  c++  java
  • 关于css 的兼容设置 ----笔记

    在开发网页的时候,由于浏览器的差异,会造成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 功能插件

  • 相关阅读:
    js 兼容各类手机 的写法 待续
    css 兼容 各类手机的写法 待续
    数组的解构赋值
    let 和 const 命令
    ECMAScript 6 简介
    webpack4新建一个项目
    Webpack 4 Tutorial: from 0 Conf to Production Mode
    webpack4.1.1的使用详细教程
    git merge git pull时候遇到冲突解决办法git stash
    Git 常用命令速查表(图文+表格)
  • 原文地址:https://www.cnblogs.com/huanying2015/p/10311108.html
Copyright © 2011-2022 走看看