zoukankan      html  css  js  c++  java
  • 前端代码规范

    Html

    熟悉每个标签的用法,用最适合的标签布局(如table只用于表格)

    基本

    <html>…</html>      定义 HTML 文档

    <head>…</head>   文档的信息

    <meta>                    HTML 文档的元信息

    <title>…</title>        文档的标题

    <link>                      文档与外部资源的关系

    <style>…</style>    文档的样式信息

    <body>…</body>   可见的页面内容

    <!--…-->                 注释

    文本

    <h1>...</h1>               标题字大小(h1~h6)

    <b>...</b>                   粗体字

    <strong>...</strong>   粗体字(强调) 

    <i>...</i>                      斜体字 

    <em>...</em>              斜体字(强调)

    <center>…</center>   居中文本

    <ul>…</ul>                 无序列表 

    <ol>…</ol>                 有序列表

    <li>…</li>                    列表项目

    <a href=”…”>…</a>    超链接

    <font>                         定义文本字体尺寸、颜色、大小

    <sub>                         下标

    <sup>                         上标

    <br>                           换行

    <p>                            段落

    图形

    <img src=’”…”>   定义图像

    <hr>                   水平线

    表格

    <table>…</table>   定义表格

    <th>…</th>            定义表格中的表头单元格

    <tr>…</tr>             定义表格中的行

    <td>…</td>           定义表格中的单元

    其它

    <form>…</form>    定义供用户输入的 HTML 表单

    <frame>                 定义框架集的窗口或框架

    Css

    符合命名规范,满足SCSS编写格式

    模块之间命名规则参考链接http://nec.netease.com/standard/css-name.html

    页头:header  登录条:loginBar  标志:logo  侧栏:sideBar  广告:banner  导航:nav  子导航:subNav  菜单:menu  子菜单:subMenu  搜索:search  滚动:scroll  页面主体:main  内容:content  标签页:tab  文章列表:list  提示信息:msg  小技巧:tips  栏目标题:title    页脚:footer  加入:joinus  指南:guild  服务:service  热点:hot  新闻:news  下载:download  注册:regsiter  状态:status  按钮:btn  投票:vote  合作伙伴:partner  版权:copyRight 

    1.CSSID的命名

    外套:wrap  主导航:mainNav  子导航:subnav  页脚:footer  整个页面:content    页眉:header  页脚:footer  商标:label  标题:title  主导航:mainNav  顶导航:topnav  边导航:sidebar  左导航:leftsideBar  右导航:rightsideBar  旗志:logo  标语:banner  菜单内容1:menu1Content  菜单容量:menuContainer  子菜单:submenu  边导航图标:sidebarIcon  注释:note  面包屑:breadCrumb(即页面所处位置导航提示)            容器:container  内容:content  搜索:search  登陆:login  功能区:shop(如购物车,收银台)  当前的current  

    2.样式文件命名  

    主要的:master.css  布局版面:layout.css  专栏:columns.css  文字:font.css  打印样式:print.css  主题:themes.css

    1.不定义无关变量,变量名命名规范,全局变量用uiModel统一管理。

    2.同一功能模块方法使用对象写法,注释齐全。

    3.功能组件化开发。

    对象开发case(angular框架)

    $scope.demoObj = {

      click:function(){

        console.log('我是点击事件')

      }

    }

  • 相关阅读:
    微信开放平台:OpenAPI、云开发与基础管理能力升级
    腾讯刘颖:从容器到低代码,腾讯云原生技术演进历程
    十年老站长心声:我为什么选择把 Hexo 网站迁移到 Webify
    腾讯云发布微搭生态开放计划,与合作伙伴携手共创产业未来
    SQL Server附加数据库出现错误5123的正确解决方法
    数据分页获取(二)
    Select语句
    数据分页获取(一)
    SQL Server中行转列原理
    QT实现Linux下系统监控小工具之二
  • 原文地址:https://www.cnblogs.com/bcjz/p/8507359.html
Copyright © 2011-2022 走看看