常用css

作者: Amfishers | 来源:发表于2016-04-11 16:47 被阅读27次

    下面的这写样式是个人根据浏览器的兼容性以及一些前辈的分享,自己所做项目经验所整理的,不一定适合所有人,但可以给大家作为参考,也是为了大家能够更方便实用。

    
    
    /*===== 清除默认的margin的属性值 =====*/
    
    body,
    
    blockquote,
    
    dd,
    
    dl,
    
    figure,
    
    form,
    
    p,
    
    pre,
    
    h1,
    
    h2,
    
    h3,
    
    h4,
    
    h5,
    
    h6 {margin:0;}
    
    /*===== 字体控制 =====*/
    
    body,
    
    input,
    
    button,
    
    select,
    
    optgroup,
    
    option,
    
    textarea,
    
    pre {font-family: Arial, 'Microsoft YaHei', 'sans-serif';}
    
    /*===== 统一设置列表的margin和padding,以及列表表形式 =====*/
    
    menu,
    
    ul,
    
    ol {list-style:none;margin:0;padding:0;}
    
    /*===== 去除个别浏览器图片底部的几个像素,以及设置图片形式链接无边框 =====*/
    
    img {vertical-align:middle; border:0; }
    
    a img {border:0 none;}
    
    /*=====  设置按钮手势    =====*/
    
    input[type="button"],
    
    input[type="submit"],
    
    input[type="reset"] { cursor:pointer; } /* 设置字体大小,这部分跟前面写在一起,IE6中会无效 */
    
    /*===== 设置表格元素的样式 =====*/
    
    table {border-spacing:0;} /* 合并表格的间隙,去掉单元格之间的间距,如有需要合并单元格为细线表格,可增加 border-collapse:collapse; */
    
    td, th, caption {padding:0;} /* 去除单元格以及caption表头的padding值 */
    
    /*=====  设置a标签链接无虚线框 =====*/
    
    a {behavior:url(common/link.htc);text-decoration: none;}
    
    area {behavior:url(common/link.htc)}
    
    /*===== 手机版本网页a标记虚线框问题 =====*/
    
    a:focus { outline:none; -moz-outline:none; }
    
    /*===== 清除浮动 =====*/
    
    .clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
    
    .clearfix{*+height:1%;}
    
    .divclear { clear:both;visibility:hidden;line-height:0px; height:0px;font-size:0;}
    
    /*===== 字体样式设置 =====*/
    
    .textAlign{  text-align:Justify;text-justify:inter-ideograph; }/*左右对齐*/
    
    /*===== 左右浮动 =====*/
    
    .floatleft{float:left;}
    
    .floatright{float:right;}
    
    /*===== 最小高度兼容 =====*/
    
    .minheight500{min-height:500px;height:auto !important;height:500px;overflow:visible;}
    
    /*===== 超出宽度设置为省略号 =====*/
    
    .ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    
    /*===== 取消chrome form表单的聚焦边框 =====*/
    
    input,button,select,textarea{outline:none}
    
    textarea{resize:none}
    
    /*===== 取消textarea右下角可拖动手柄 =====
    
    textarea{ resize:none }*/
    
    /*===== webkit 水平居中 =====*/
    
    .divmiddle{display:-webkit-box;-webkit-box-pack:center; -webkit-box-align: center; }
    
    /*===== placeholder占位符颜色自定义 =====*/
    
    input:-moz-placeholder { color: #369; }
    
    ::-webkit-input-placeholder { color:#369; }
    
    
    
    

    相关文章

      网友评论

          本文标题:常用css

          本文链接:https://www.haomeiwen.com/subject/maeilttx.html