自学web前端css的选择符有哪些?

html-css012

自学web前端css的选择符有哪些?,第1张

css的选择符主要有以下几种:

id选择器( # myid)

类选择器(.myclassname)

标签选择器(div, h1, p)

相邻选择器(h1 + p)

子选择器(ul >li)

后代选择器(li a)

通配符选择器( * )

属性选择器(a[rel = "external"])

伪类选择器(a:hover, li:nth-child)

三种基本的选择器类型语法如下:◆标签名选择器,如:p{},即直接使用HTML标签作为选择器。◆类选择器,如.polaris{}。◆ID选择器,如#polaris{}。所有元素可继承:visibility和cursor。内联元素可继承:letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction。终端块状元素可继承:text-indent和text-align。列表元素可继承:list-style、list-style-type、list-style-position、list-style-image。

今天小编要跟大家分享的文章是关于Web前端开发规范之css规范。Web前端作为开发团队中不可或缺的一部分,需要按照相关规定进行合理编写(一部分不良习惯可能给自己和他人造成不必要的麻烦)。不同公司不同团队具有不同的规范和文档。下面是根据不同企业和团队的要求进行全面详细的整理结果。来和小编一起看一看css规范的原则吧!

css规范

1、编码规范为utf-8。

2、协作开发及分工:i会根据各个模块,同时根据页面相似程序,事先写**体框架文件,分配给前端人员实现内部结构&表现&行为。共用css文件base.css由i书写,协作开发过程中,每个页面请务必都要引入,此文件包含reset及头部底部样式,此文件不可随意修改。

3、class与id的使用:id是唯一的并是父级的,class是可以重复的并是子级的,所以id仅使用在大的模块上,class可用在重复使用率高及子级中。id原则上都是由我分发框架文件时命名的,为JS预留钩子的除外。

4、为JS预留钩子的命名,请以js_起始,比如:js_hide,js_show。

5、class与id命名:大的框架命名比如header/footer/wrapper/left/right之类的在2中由i统一命名.其他样式名称由小写英文&数字&来组合命名,如i_comment,fontred,width200。避免使用中文拼音,尽量使用简易的单词组合。总之,命名要语义化,简明化

6、规避class与id命名(此条重要,若有不明白请及时与i沟通):a)通过从属写法规避,示例见d。b)取父级元素id/class命名部分命名,示例见d。c)重复使用率高的命名,请以自己代号加下划线起始,比如i_clear。d)a,b两条,适用于在2中已建好框架的页面,如,要在2中已建好框架的页面代码中加入新的div元素,按a命名法则:...,样式写法:#mainnav.firstnav{.......}按b命名法则:...,样式写法:.main_firstnav{.......}

7、css属性书写顺序,建议遵循:布局定位属性-->自身属性-->文本属性-->其他属性.此条可根据自身习惯书写,但尽量保证同类属性写在一起.属性列举:布局定位属性主要包括:display&list-style&position(相应的top,right,bottom,left)&float&clear&visibility&overflow

自身属性主要包括:width&height&margin&padding&border&background。

文本属性主要包括:color&font&text-decoration&text-align&vertical-align&white-space&

其他&content。

8、书写代码前,提高样式重复使用率。

以上就是小编今天为大家分享的关于Web前端开发规范之css规范的文章,希望本篇文章能够对正在从事Web前端工作的小伙伴们有所帮助,想要了解更多Web前端知识记得关注北大青鸟Web培训官网,最后祝愿小伙伴们工作顺利,成为一名优秀的Web前端工程师。