zoukankan      html  css  js  c++  java
  • CSS代码优化

    1.增加代码重用率

    body{ margin: 0px; padding: 0px; } 
    #header{ padding: 10px; background-color: #ffbf00; }
    #header h1{ font-size: 25px; color: #ffffff; }
    #nav{ float: left; padding: 10px; background-color: #6a6a58; height: 500px; font-size: 14px; }
    #nav a{ color: #ffffff; }
    #content{ background-color: #eeeeee; height: 500px; padding: 10px; font-size:14px; }
    #content ul{ margin:0px; }

    可以将属性值相等的合并,优化后

    *{ margin: 0px; padding: 0px; }
    #header,#nav,#content{ padding: 10px; }
    #header,a{ color: #fff; }
    #header h1{ font-size: 25px; }
    #header{ background-color:#ffbf00; }
    #nav,#content{ height: 500px; font-size: 14px; }
    #nav{ float: left; background-color: #6a6a58; }
    #content{ background-color: #eee; color:#000; }

    2.使用样式经行覆盖

    .ls1,.ls2,.ls3{ font-size:12px; list-style:none; 200px; padding:10px; background-color:#eeeeee; } 
    .ls1{ border:1px solid #4b4ed5; }
    .ls2{ border:1px solid #ac4bd5; }
    .ls3{ border:1px solid #82d54b; }

    优化后如下:

    .ls1,.ls2,.ls3{ font-size:12px; list-style:none; 200px; padding:10px; background-color:#eeeeee; border:1px solid #4b4ed5; } 
    .ls2{ border:1px solid #ac4bd5; }
    .ls3{ border:1px solid #82d54b; }
  • 相关阅读:
    结构型模式上
    创建型模式下
    创建型模式中
    创建型模式上
    设计模式总述
    Java中事件机制
    UI常用控件
    UITextField和UIViewConteoller
    UIScrollView 和 UIPageControl
    分栏视图控制器
  • 原文地址:https://www.cnblogs.com/lmy-moonsky/p/3392452.html
Copyright © 2011-2022 走看看