• css命名简单框架


    转自许未来

    /*本文只针对个别在跨浏览器不同效果的元素设置进行注释和注意要点,其他均不做修改注释*/
    /*本文针对公司其他成员css水平,进行弱化处理。目的是为了提高工作效率。*/
    /*下拉菜单请参照:http://bbs.blueidea.com/thread-2854011-1-1.html*/
    /*{}(大括号)内为空时,除ul元素外,其他均自己定义*/
    引用

    body,ul,ol,p,span,dd,dt,h1,h2,h3,h4,h5,h6{ margin:0px; padding:0px;}/*初始化元素/内联外联值为0/但最好加上font-size:XXpx*/
    div{ overflow:hidden}
    body,body a{ color:#000; font:Arial, Helvetica, sans-serif 12px; text-decoration:none}
    body a:link{ text-decoration:none;}
    body a:hover{}
    body a:visited{}/*全局文字属性结束*/
    ol,li{ list-style:none;}/*如需居内则为list-style:inside*/
    p{ text-indent:2em}/*首行缩进两字符宽度,无需更改,使用时可按“<p class="xxx"></p>” 设置进一步样式*/
    /**************************以上均为全局属性,一般无需修改**************************************/
    h1{ font:"宋体" 16px bold; line-height:30px; text-align:center; border-bottom:1px dashed #ccc;}/*设置默认H1样式*/
    h2{ font:"宋体" 14px bold; line-height:26px; text-align:left; border-bottom:1px solid #ccc}
    h3{}
    h5{}
    h4{}

    /***************************hx样式,如颜色不同请自行增加,根据实际情况进行简写****************************/
    .fontnews{}
    .fontnews li{}
    .fontnews li a{}
    .fontnews li a:hover{}
    /*例:
    .fontnews{}
    .fontnews li{ height:14px; padding:4px 0px; border-bottom:1px dashed #ccc;}
    .fontnews li a{ text-decoration:none; font:12px; color:#000;}
    .fontnews li a:hover{ color:#ff0000}
    */
    /*新闻列表,如需高级设置请参照:http://bbs.blueidea.com/thread-2848618-1-1.html*/

    .piclist{}
    .piclist div{}/*图片列表*/
    /*例:
    .piclist{ overflow:hidden; padding:10px;}/*piclist全局
    .piclist div{ padding-right:10px; overflow:hidden; float:left;}/*使用嵌套思维,piclist下的所有div的属性,如有不同,请用#+ID号来区别,此方法可解决IE6下piclist 无法解析高度的情况。不需任何hack
    .piclist a{ color:#cc0000; line-height:22px; font-weight:bold; font-size:12px;}/*piclist下文字a及链接属性简单版。
    .piclist a:hover{ color:#000; }/文字及链接鼠标状态
    */
    /***************************图片列表****************************/

    .fontview{}/*view页*/
    /*例
    .fontview{ padding:10px; line-height:26px; font:14px; color:#555; text-decoration:none;}
    */


    /***********************************通用型*************************************/
    .gm{}
    .gmfl{ float:left;}/*左浮动*/
    .gmfr{ float:right;}/*右浮动*/
    .gmpadding10px{ padding:10px;}/* 内联10px*/
    .gmflpadding10px{ padding:10px; float:left}/*内联10px并左浮动*/
    .gmfrpadding10px{ padding:10px; float:right}/*内联10px并右浮动*/
    /************************************************************/
    .img{}
    /**************IMG*****************/
    /*
    例:
    [color=#FF1493].img
    { padding:2px; border:2px solid #ccc; background:#fff;}内联2px,背景白色,直线边框粗1px;
    */[/color]

    .select{}
    .input{}/*输入文本框*/
    .search{}/*搜索*/
    .insearch{}/*搜索内*/
    .searchselect{}/*搜索条*/
    .serachbuttom{}/*搜索按钮*/
    /*************************select/表单/下拉等******************************/

    .listbox{}/*表格整体框架*/
    .listbox-table{}/*表格的宽度*/
    .listbox-header{}/*表格头部文字样式*/
    .listbox-entry{}/*表格正文文字样式*/
    /********************table*********************/

    .clear{ clear:both;}

    .clearleft{ clear:left}
    .clearright{ clear:right}
    /*************************清除浮动项**************************/

    /*开始布局layout设置*/
    #wrapper{}/*整体大框架*/
    #inwrapper{}/*大框架内*/
    .top{}/*顶部及banner*/
    .intop{}/*顶部及banner内*/
    .logo{}/*logo*/
    .inlogo{}/*logo内*/
    .banner{}/*banner*/
    .menu{}/*导航:*/
    .inmenu{}/*导航内*/
    .Menuul{}/**/
    .Menuul li{}/**/
    .Menuul li a{}/**/
    .inmenu_xiala{}/*下拉菜单*/
    .Inmenu_xialaul{}/**/
    .Inmenu_xialaul li{}/**/
    .Inmenu_xialaul li a{}/**/
    .mainWrapper{}/*主体内容*/
    .inmainwrapper{}/*主体内容内*/
    .sideleft{}/*左侧拦*/
    .insideleft{}/*左侧内*/
    .sideright{}/*右侧栏*/
    .insideright{}/*右侧内*/
    .sidecenter{}/*中间*/
    .insidecenter{}/*中间内*/
    .foot{ clear:both}/*底部*/
    .infoot{}/*底部内*/
  • 相关阅读:
    操作系统面试题(四)
    计算机网络面试题(三)
    redis和mongodb面试题(一)
    MySQL面试题(二)
    数据库基础面试题(一)
    RoBERTa模型总结
    BERT模型总结
    动态规划-Dynamic Programming(DP)
    XGBoost原理学习总结
    re模块的使用
  • 原文地址:https://www.cnblogs.com/yuzhongwusan/p/1276759.html
Copyright © 2020-2023  润新知