百度前端代码规范:CSS】的更多相关文章

1.代码风格 1.1 文件 [建议] CSS 文件使用无 BOM 的 UTF-8 编码. 1.2 缩进 [强制] 使用 4 个空格做为一个缩进层级,不允许使用 2 个空格 或 tab 字符. 1.3 空格 [强制] 选择器 与 { 之间必须包含空格. .selector { } [强制] 属性名 与之后的 : 之间不允许包含空格, : 与 属性值 之间必须包含空格. margin: 0; [强制] 列表型属性值 书写在单行时,, 后必须跟一个空格. font-family: Arial, san…
Bootstrap CSS编码规范 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 为选择器分组时,将单独的选择器单独放在一行. 为了代码的易读性,在每个声明块的左花括号前添加一个空格. 声明块的右花括号应当单独成行. 每条声明语句的 : 后应该插入一个空格. 为了获得更准确的错误报告,每条声明都应该独占一行. 所有声明语句都应当以分号结尾.最后一条声明语句后面的分号是可选的,但是,如果省略这个分号,你的代码可能更易出错. 对于以逗号分隔的属性值,每…
CSS规范 一.命名规范BEM(Block Element Modifier) 1.Block name -- 实体名称中的单词之间用连字符分隔(-) HTML <div class="menu">...</div> <div class="menu-name">...</div> CSS .menu { color: red; } .menu-name { color: red; } 2.Element name *…
HTML 1.代码风格 1.1缩进与换行 [强制] 使用 4 个空格做为一个缩进层级,不允许使用 2 个空格 或 tab 字符. <style> ul { padding:; } </style> <ul> <li>1</li> <li>2</li> <ul> [建议] 每行不得超过 120 个字符. 1.2 命名 [强制] class 必须单词全字母小写,单词间以 - 分隔. [强制] class 必须代表相…
Web 前端代码规范 最后更新时间:2017-06-25 原始文章链接:https://github.com/bxm0927/web-code-standards 此项目用于记录规范的.高可维护性的前端代码,这是通过分析 Github 众多前端代码库,总结出来的前端代码书写规范. 目录 前端普适性规范 HTML 规范 CSS 规范 JS 规范 License public domain, Just take it. Thanks @Ruan YiFeng: https://github.com/…
eslint+prettier+husky+lint-staged 统一前端代码规范 遵循编码规范和使用语法检测,可以很好的提高代码的可读性,可维护性,并有效的减少一些编码错误. 1.终极目标 团队中的所有开发人员用一套代码规范规则,并且无需我们花太大的精力去为了格式而格式.希望有一套自动化工具,帮我们检测代码是否规范,如果不规范,则自动能够帮我们按照既定规范格式化. 实现这一目标需解决的问题: 1.代码规范落地难:面对开发规范经常面临的现状是很难落地,总是"拆东墙补西墙",归根结底在…
本文来自:百度FEX 1 前言 CSS作为网页样式的描述语言,在百度一直有着广泛的应用.本文档的目标是使CSS代码风格保持一致,容易被理解和被维护. 虽然本文档是针对CSS设计的,但是在使用各种CSS的预编译器(如less.sass.stylus等)时,适用的部分也应尽量遵循本文档的约定. 2 代码风格 2.1 文件 [建议] CSS 文件使用无 BOM 的 UTF-8 编码. 解释:TF-8 编码具有更广泛的适应性.BOM 在使用程序或工具处理文件时可能造成不必要的干扰. 2.2 缩进 [强制…
新增:http://materliu.github.io/code-guide/#project-naming HTML 原则1.规范 .保证您的代码规范,保证结构表现行为相互分离.2.简洁.保证代码的最简化,避免多余的空格.空行,保持代码的语义化,尽量使用具有语义的元素,避免使用样式属性和行为属性.任何时候都要用尽量简单.尽量少的元素解决问题.3.实用.遵循标准,但是不能以牺牲实用性为代价.4.忠诚.选择一套规范,然后始终遵循.不管代码由多少人参与,都应该看起来像一个人写的一样 语法1.小写.…
1.前后端json对接的规范. 前后端的json代码规范 result ={ success:”true”,//true表示成功,false表示失败. data:{}, //数据 errorCode:””,//错误码,下面有例子 message:””//报错原因 } var ec = { "00000101": "用户名或密码不能为空", "00000102": "用户名不存在", "00000103":…
一.    规范目的: 为提高工作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,在网站建设中,使结构更加清晰,代码简明有序,有一个更好的前端架构,有利于SEO优化.   二.    规范基本准则: 符合web标准,使用具有语义的标签,使结构.表现.行为分离,兼容性优良,页面性能优化,代码简洁.明了.有序,尽可能的减少服务器的负载,保证最快的解析速度.   三. 文件规范: html.css.js.images文件均归档至约定的目录中.   1.    html (1)编码:所有…
本文来自:百度FEX 1 前言 JavaScript在百度一直有着广泛的应用,特别是在浏览器端的行为管理.本文档的目标是使JavaScript代码风格保持一致,容易被理解和被维护. 虽然本文档是针对JavaScript设计的,但是在使用各种JavaScript的预编译语言时(如TypeScript等)时,适用的部分也应尽量遵循本文档的约定. 2 代码风格 2.1 文件 [建议] JavaScript 文件使用无 BOM 的 UTF-8 编码. 解释:UTF-8 编码具有更广泛的适应性.BOM 在…
Bootstrap HTML编码规范 本文转载自w3cschool. 由于bootstrap得到了世界的认可,因此,此规范用于规范html代码有一定的说服力. 交流qq群:164858883.欢迎各位程序猿共享说得,共同进步,共同推进互联网的发展. 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 嵌套元素应当缩进一次(即两个空格). 对于属性的定义,确保全部使用双引号,绝不要使用单引号. 不要在自闭合(self-closing)元素的尾部添加斜线 -…
来源于:http://alloyteam.github.io/CodeGuide/ 命名规则 项目命名 全部采用小写方式, 以下划线分隔. 例:my_project_name 目录命名 参照项目命名规则: 有复数结构时,要采用复数命名法. 例:scripts, styles, images, data_models JS文件命名 参照项目命名规则. 例:account_model.js CSS, SCSS文件命名 参照项目命名规则. 例:retina_sprites.scss HTML文件命名…
本文来自:百度FEX 1 前言 HTML 作为描述网页结构的超文本标记语言,在百度一直有着广泛的应用.本文档的目标是使 HTML 代码风格保持一致,容易被理解和被维护. 2 代码风格 2.1 缩进与换行 [强制] 使用 4 个空格做为一个缩进层级,不允许使用 2 个空格 或 tab 字符. 解释:对于非 HTML 标签之间的缩进,比如 script 或 style 标签内容缩进,与 script 或 style 标签的缩进同级. <style> /* 样式内容的第一级缩进与所属的 style…
合理的避免使用ID 一般情况下ID不应该被应用于样式. ID的样式不能被复用并且每个页面中你只能使用一次ID. 使用ID唯一有效的是确定网页或整个站点中的位置. 尽管如此,你应该始终考虑使用class,而不是id,除非只使用一次 另一个反对使用ID的观点是含有ID选择器权重很高. CSS选择器中避免标签名 当构建选择器时应该使用清晰, 准确和有语义的class(类)名.不要使用标签选择器. 如果你只关心你的class(类)名 ,而不是你的代码元素,这样会更容易维护. 如果你只使用具有实际意义的c…
今天在牛客网上看到这道题,发现自己并不会,看来自己css都没怎么学习,也不怎么会用.看了下答案,不是很明白,也在网上搜集了一些资料和解法,感觉一些同学博客上也写了一些解法和拓展,所以就在这里借鉴一下咯.(参考地址:http://www.ithao123.cn/content-5672159.html) 实现图示的效果涉及到的知识主要有两点:一个是before.after伪元素,一个是border 1.before 和 after 都是css中的伪元素,通过给定一个属性content给元素添加新的…
编码 在 css 首行设置文件编码为 UTF-8. @charset "UTF-8"; class 命名 class 名称应当尽可能短,并且意义明确.使用有意义的名称,使用有组织的或目的明确的名称,不要使用表现形式的名称. 不推荐 ;} .red {color:red;} 推荐 ;} .important {color:red;} 使用中划线(-)分隔 class 中的单词.虽然它很不方便的让你双击选择,但是它可以增强理解性.另外属性选择器 [attribute|=value] 也能识…
不要重置对象的引用!(重置只应该在组件或服务的初始化时) why:会使页面产生闪烁 不要给图片绑定一个空的值或空的图片引用(如果值从服务器异步过来,那应该在初始化时给它一个默认值)why:会触发一个404的请求 (如:img src=http://xxxx/null) 页面全部使用最新的angular2写法,on-click=>(click) bind-src=>[src] bind-html=>[innerHtml] 规范: 拆分模型和控制器(保持“瘦”控制器,“胖”模型的原则[界面交…
http://codeguide.bootcss.com/ HTML 语法 HTML5 doctype 语言属性(Language attribute) 字符编码 IE 兼容模式 引入 CSS 和 JavaScript 文件 实用为王 属性顺序 布尔(boolean)型属性 减少标签的数量 JavaScript 生成的标签 CSS 语法 声明顺序 不要使用 @import 媒体查询(Media query)的位置 带前缀的属性 单行规则声明 简写形式的属性声明 Less 和 Sass 中的嵌套…
命名规范 ECMAScript 规范中标识符采用驼峰大小写格式,驼峰命名法由小(大)写字母开始,后续每个单词首字母都大写.根据首字母是否大写,分为两种方式: Pascal Case 大驼峰式命名法:首字母大写.eg:StudentInfo.UserInfo.ProductInfo Camel Case 小驼峰式命名法:首字母小写.eg:studentInfo.userInfo.productInfo 标识符,则包括变量.函数名.类名.属性名和函数或类的参数,每个命名方法又略有不同,下面详细解释一…
github:https://github.com/fex-team/styleguide 离线版本: 链接:http://pan.baidu.com/s/1gfr857l 密码:cvk3 注:只支持markdown进行查看.…
web前端的代码规范主要针对的是HTML,CSS和javaScript代码. 前端代码规范在不同场合会有差异,但是规范的前端代码应该具有以下特征: 1.符合标准 所谓的标准是指W3C指定的web标准,包括语言的规范,开发中使用的原则和解释引擎行为等,主要有三部分组成:结构标准(html和xhtml部分).表现标准(css部分)和行为标准(javascript部分). 2.格式规范统一 前端代码的格式主要包括命名.代码缩进.空格和空行的使用以及代码注释.命名主要有HTML元素的id和class名,…
HTMLCSS文档规范 HTML和CSS文档必须采用UTF-8编码格式: HTML文档必须使用HTML5的标准文档格式: HTMLCSS编写规范 HTML和CSS的标签.属性.类名.ID都必须使用小写字母: HTML和CSS的属性.类名.ID命名必须具有语义化: HTML代码必须保持文档结构清晰,必须合理的进行代码缩进: CSS文件禁止样式表内引用CSS文件: CSS编写格式,样式代码保持一行,多个选择器同一个规则必须换行,如图1: CSS样式表格分为3个级别:系统级(以lib_开头).模块级(…
前言 There are a thousand Hamlets in a thousand people's eyes. 一千个程序员,就有一千种代码风格.在前端开发中,有几个至今还在争论的代码风格差异: 单引号还是双引号? 代码行结束是否需要分号? 两个空格还是四个空格? ... 这几个代码风格差异在协同开发中经常会被互相吐槽,甚至不能忍受. 除此之外,由于 JavaScript 的灵活性,往往一段代码能有多种写法,这时候也会导致协同时差异.并且,有一些写法可能会导致不易发现的 bug,或者这…
简要介绍 本文通过参考百度腾讯等前端编码规范(链接建文末),得出个人习惯的编码规范.个人编码规范采用在不影响可读性的情况下能省就省,尽量简洁,不需要就直接去掉. 最佳原则不管是个人编码规范还是团队编码规范,一旦规范制定完毕就应该坚持使用,保持前后规范一致. 笔记通过MarkDown写成,对应的GitHub地址为:https://github.com/xys2015/mdnote 命名规则 项目名称,目录名称,一律采用小写方式,以下划线分割.例如:my_project_name 常见命名推荐:im…
Alpha代码规范.冲刺任务与计划 团队名称: 云打印 作业要求: Alpha代码规范.冲刺任务与计划 作业目标:代码规范.冲刺任务与计划. 团队队员 队员学号 队员姓名 个人博客地址 备注 221600412 陈宇 http://www.cnblogs.com/chenyuu/ 队长 221600411 陈迎仁 https://www.cnblogs.com/yinen/ 221600409 蔡森林 https://www.cnblogs.com/csl8013/ 221600401 陈诗娴…
代码可以改变世界 不规范代码可以毁掉世界 只有先学会写规范的代码,才可以走的更远 编程语言之间有很多编程规范都是通用: 命名 不要用语言不明的缩写,不用担心名字过长,名字一定要让别人知道确切的意思; 类.类型.变量用名词或组合名词.如Member, ProductInfo; 函数名用动词或者动宾组合词来表示,如get/set,RenderPage(); 布尔变量需要用is做前缀; 尽量写绝对路径; 注释 注释是为了解释程序做了什么(What)或者为什么这么做(Why),以及要特别注意的地方: 注…
代码规范 代码规范整合了自身项目实践还有诸多好的大公司的代码规范.如阿里巴巴开发手册.华为Java规范.W3C前端规范等. 由于内容过于详细和细致,为了方便查看,将其放置在了showDoc网站上(同时也方便了文档的编辑和管理). 由于校园帮项目后端使用java.前端使用html.css.js,前后端语言不同.代码规范也有所差异.故而将之分为了两个文档,方便不同人员的查看: showDoc 后端Java代码规范 showDoc 前端代码规范 冲刺任务计划与分工 请参看Leangoo超级详细的项目分…
3.HTML代码规范 .html文件必须存放在项目工程约定的目录中. .html文件的命名:以模块 + 功能的结合方式来命名,比如:newsList.html. 文档类型声明:HTML4中使用<!DOCTYPE HTML PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” ”http://www.w3.org/TR/xhtml/DTD/xhtml1-transitional.dtd”>,但是在HTML5中文档类型的声明方式被简化,直接:<!DO…
任务一:零基础HTML编码 课程概述 作业提交截止时间:04-24 重要说明 百度前端技术学院的课程任务是由百度前端工程师专为对前端不同掌握程度的同学设计.我们尽力保证课程内容的质量以及学习难度的合理性,但即使如此,真正决定课程效果的,还是你的每一次思考和实践. 课程多数题目的解决方案都不是唯一的,这和我们在实际工作中的情况也是一致的.因此,我们的要求不仅仅是实现设计稿的效果,更是要多去思考不同的解决方案,评估不同方案的优劣,然后使用在该场景下最优雅的方式去实现.那些最终没有被我们采纳的方案,同…