• 前端命名


    1、避免单个css文件过大(少于300行)
    2、命名是使用通用名称表改元素不表特定意义
    3、id和class越简短越好,但是前提是要别人一看能理解
    4、命名采用小写和中划线-,不能使用大写和下划线
    5、为了提高代码的复用性,样式尽量采用组合的方式

    页面结构

    *容器——container
    *页头——header
    *内容——content
    *页面主体——main
    *页尾——footer
    *侧栏——sidebar
    *栏目——column
    *页面外围控制整体布局宽度——wrapper
    *左右中——left right center

    导航

    *导航——nav
    *主导航——mainnav
    *子导航——subnav
    *顶导航——topnav
    *边导航——sidebar
    *左导航——leftsidebar
    *有导航——rightsidebar
    *菜单——menu
    *子菜单——submenu
    *标题——title
    *摘要——summary

    功能

    *标志——logo
    *广告——banner
    *登录——login
    *登录条——loginbar
    *注册——regsiter
    *搜索——search
    *功能区——shop
    *标题——title
    *加入——joinus
    *状态——status
    *按钮——btn
    *滚动——scroll
    *标签页——tab
    *文章列表——list
    *提示信息——msg
    *当前的——current
    *小技巧——tips
    *图标——icon
    *注释——note
    *指南——guild
    *服务——service
    *热点——hot
    *新闻——news
    *下载——download
    *投票——vote
    *合作伙伴——partner
    *友情链接——link
    *版权——copyright

    属性编写顺序

    显示属性:display/list-style/position/float/clear...
    自身属性/盒模型:width/height/margin/padding/border
    背景:background
    行高:line-height
    文本属性:color/font/text-decoration/text-align/text-indent/vertical-align/white-space/content....
    其他:cursor/z-index/zoom/overflow
    CSS3属性:transform/transition/animation/box-shadow/border-radius
    css3属性必须写-webkit- / -moz- / -ms- / -o- 标准属性写在后面

    性能优化

    1、尽量使用缩写(属性)
    2、选择器尽量避免嵌套,减少查询消耗
    3、选择器性能,越具体的关键选择器性能越好(id——>class——>标签选择器——>相邻选择器——>子选择器——>后代选择器——>*——>属性选择器——>伪选择器)
    4、0后面不要带单位,0px写成0,0.8px写成.8px
    5、颜色取值要大写,并且尽量用三位数表示

  • 相关阅读:
    hudson搭建经验总结(二)
    CodePen最佳实例分享
    hudson搭建经验总结
    资料文件夹管理系统
    ueditor+word图片上传
    asp.net上传大文件
    UEditor粘贴word
    大文件上传组件
    文件资源管理系统
    ueditor+复制word图片粘贴上传
  • 原文地址:https://www.cnblogs.com/snly/p/6840627.html
Copyright © 2020-2023  润新知