zoukankan      html  css  js  c++  java
  • 我的 HTML,CSS 编码习惯

    HTML 编码习惯

    • 每个 HTML 页面的第一行添加标准模式的声明
    <!DOCTYPE html>
    
    • 为 html 根元素指定 lang 属性,从而为文档设置正确的语言
    <html lang="zh">
    
    • 在 head 标签内部声明字符编码
    <meta charset="UTF-8">
    
    • 引入 CSS 和 JavaScript 文件时不需要指定 type 属性
    <link rel="stylesheet" href="XXXX.css">
    <script src="XXXX.js"></script>
    
    • 自闭合标签尾部不要添加斜线
    • 对于属性的定义统一用双引号,且 class 属性放在第一个

    CSS 编码习惯

    • CSS 文件命名习惯

      1. CSS 文件使用无 BOM 的 UTF-8 编码 ;
      2. 引入 Normalize.css 初始化样式作为每个页面的基础样式,且最好不要做任何修改;
      3. 采用 style.css 作为页面公共样式,比如 body 等元素,或 .hidden、.unselect;
      4. 采用 themes.css 文件名实现项目换肤功能;
      5. 采用 模块名.css 作为各模块私有样式,如 print.css;
    • CSS 样式命名习惯

      1. 尽量采用 class 作为选择器,避免用 id 选择器;
      2. 避免 class 和 id 命名重复;
      3. 样式与结构分离,避免行内样式;
      4. 代码命名中,一律采用小写加连接符,如:header-container;
      5. 属性值尽量采用缩写,如:padding、margin;
      6. 十六进制颜色尽量采用缩写,如:#fff;
    • CSS书写顺序习惯

      1. 位置属性(position, top, right, z-index, display, float等);
      2. 大小(width, height, padding, margin);
      3. 文字系列(font, line-height, letter-spacing, color- text-align等);
      4. 背景(background, border等);
      5. 其他(animation, transition等);
    • CSS 常见命名习惯

      1. 容器:container
      2. 页眉:header
      3. 导航:nav
      4. 标志:logo
      5. 标题:title
      6. 菜单:menu
      7. 子菜单:submenu
      8. 横幅:banner
      9. 轮播图:swipe
      10. 主体:main
      11. 页尾:footer
      12. 版权:copyright
      13. 友情链接:link
      14. 按钮:btn
      15. 图标:icon
  • 相关阅读:
    POJ3259 Wormholes
    leetCode-Plus One
    leetCode-Pascal's Triangle
    leetCode-Longest Continuous Increasing Subsequence
    leetCode-Missing Number
    leetCode-Maximum Product of Three Numbers
    leetCode-Image Smoother
    leetCode-Contains Duplicate
    机器学习实战笔记-使用Apriori算法进行关联分析
    leetCode-Degree of an Array
  • 原文地址:https://www.cnblogs.com/tracine0513/p/12435125.html
Copyright © 2011-2022 走看看