zoukankan      html  css  js  c++  java
  • 用css去除chrome、safari等webikt内核浏览器对控件默认样式

    有这么一个webkit的私有属性:

        -webkit-appearance:none; /*去除input默认样式*/

    添加该样式,并且值为'none'时即可取消浏览器对于控件的默认样式。

    另外这个属性也有个神奇的地方~ 他可以用来调用显示浏览器对各种控件的默认样式,比如:

    <span style="-webkit-appearance:button;"> 我是span啊亲!!</span>

    那么他所显示的效果是:

      

    哈 觉得挺有趣的~  另外这个属性可以用来去除Iphone上面那个恶心的超大圆角的按钮默认样式,从而使自己编辑的按钮样式显示正常。

    下面是这个属性可能会有的值,也算是可以显示的浏览器控件默认效果。

    • checkbox
    • radio
    • push-button
    • square-button
    • button
    • button-bevel
    • listbox
    • listitem
    • menulist
    • menulist-button
    • menulist-text
    • menulist-textfield
    • scrollbarbutton-up
    • scrollbarbutton-down
    • scrollbarbutton-left
    • scrollbarbutton-right
    • scrollbartrack-horizontal
    • scrollbartrack-vertical
    • scrollbarthumb-horizontal
    • scrollbarthumb-vertical
    • scrollbargripper-horizontal
    • scrollbargripper-vertical
    • slider-horizontal
    • slider-vertical
    • sliderthumb-horizontal
    • sliderthumb-vertical
    • caret
    • searchfield
    • searchfield-decoration
    • searchfield-results-decoration
    • searchfield-results-button
    • searchfield-cancel-button
    • textfield
    • textarea

    具体可以浏览这个网站,上面有对于这些效果的demo,狠狠地戳这:http://davidwalsh.name/webkit-appearance

  • 相关阅读:
    《算法图解》——第六章 广度有限搜索
    《算法图解》——第一章 算法简介
    《算法图解》——第二章 选择排序
    go-json处理的问题
    Go断言
    Go Example--格式化字符串
    Go Example--strings
    Go Example--组合函数
    Go Example--defer
    Go Example--panic
  • 原文地址:https://www.cnblogs.com/jintaostudy/p/6594647.html
Copyright © 2011-2022 走看看