div+css样式表的id和class常用命名规则

开着越野放牛 · *发表于* 2013-6-14 21:01:28

div+css样式表的id的常用命名规则如下表所示:

页头; G" ^/ o- }, u# V/ S+ o6 V	header ; y% r1 F/ J! O! g3 t( v5 }	登录条' {2 x. x0 p2 k1 c8 o: g3 i	loginBar7 A$ \8 E* \|: G i; H	标志 5 I, \|! X5 W1 j! o& z	logo 1 X' D; a% \. a* ` [
侧栏- I5 L* y _; m. C% ^0 [; j	sideBar - J" f& Q; N0 I" s) _1 _: y. Y. K( F	广告 * ~) X; O2 k9 L J R* i	Banner1 z# e+ C# t; u5 m5 u1 m" g: [	导航+ z0 d% O% R) I* F5 ]" U4 X	nav 9 U( b. ]. \0 _. s
子导航: ~- ?/ l$ X! U% _% Z2 V7 s	subNav& R: M8 i+ F. ^: K# l- A, e	菜单( q$ O0 J- n" Y# g% K	menu5 i: o: U4 \; p/ g! r# L* V	子菜单 . h2 H9 B+ x; Z! n; I/ H! k	subMenu * } l' a8 [/ D' [) b8 \|, m
搜索 ; P! a( M% z- d7 m9 I	search ) R6 U z" b, @ X. x: @	滚动 3 ^3 v% u9 ^ l	scroll 3 v; k) s! y/ b7 o) W5 k( E1 B- f	页面主体4 \: X& {# y/ f& y8 N* C	main' W! D0 `6 Y7 t
内容5 H# I/ E5 S! c8 x- \|6 i% O	content " Z# h) S# E; K	标签页; r7 H2 w% a4 D" Q: h	tab' x6 s& N. W4 ^6 `3 J/ \* ~	文章列表) n$ F; Q% [7 t" `	list 9 ` @ f- S* u! L$ a( j
提示信息 / { w S) I8 _) z	msg 2 W, H/ r0 V. l8 f	小技巧9 _ u4 q; y9 c) J+ ~9 a- l0 }	tips0 t* M/ m( a$ M2 T! `/ i4 I" U/ O	栏目标题 8 i% j" `: S: o$ {, Y: \	title " e( T5 ?7 k$ `" b
加入1 c; C4 @% i, h, x( I	joinus) I4 T T" `' \. r+ R9 [% T' }. w	指南4 H; ?1 s% ]. L0 }4 C9 x: `. o	guild _9 [: o' W; G/ K4 z( f	服务8 _7 }8 X: }6 v3 g9 y S	service * g+ A) J6 R s/ o( q' M n4 k# t
热点6 X& R) H7 ?# t! e1 y% `" ?4 X	hot $ u- o& G: K. J9 @	新闻 6 M; z" c" \|8 u, x8 \|' b	news 1 O/ M2 ~5 S$ P# [; k/ @	下载- o" n& q1 j0 z" U7 S	download, N0 N! G5 E6 J7 j% e1 Y; L! N
注册 - k: r7 z$ V: N- m, S- `2 e0 C	regsiter" y& m, r9 p, q7 y3 ^6 V	状态9 a9 f1 V, B. O	status y5 f6 ]5 L4 d5 a- m6 ^	按钮 4 T5 U1 w$ A; @: O	btn ; y! B- e& Z, ?/ w$ C/ `" g
投票7 k- {. C' A% \% q5 Y) s* G; F	vote M4 N" N% V+ e8 s4 u+ J/ ^/ z% y O	合作伙伴' U- s0 L( P& I) L% L: {	partner 1 P6 y! \|$ L* r	友情链接 . N( y! S% ]- H0 w! V w	friendLink5 U5 O( Z+ d+ ?) }
页脚 2 o; D5 W: \( @8 m3 m	footer' Q, ]5 v# m6 E$ Q# Q( j2 o5 [	版权* ^. V! X0 v0 p4 \	copyRight* o. L6 i! e# S. U	0 L: h5 e- N, ?7 `. O9 R	5 I* C* M4 x+ I. X; u% `

div+css样式表的class的常用命名规则如下表所示:

外　套% M; l! D& H0 m) r	wrap , H6 b, z! G8 f9 a# k v	主导航 ! n Y! `% D" o& I1 W	mainNav0 W4 b/ ~$ w" i. C H	子导航 ( Q& `7 f! C4 f$ y% r	subnav $ ~7 Y+ q! ?+ V) S5 o9 w
页　脚 . K& D# v# O7 ^. c4 [	footer+ U- k4 I: U, ]# r' i+ e* }* r0 h	整个页面( v! y6 a1 R5 b+ H1 Y* x	content " K# L8 L6 U( B% u" Z	页　眉 1 x8 x6 E. s* L6 h, Z" p; a2 \|	header& t+ \|, M: V% K
商　标$ a0 C9 D9 S7 O	label $ F+ J4 ~$ r: q- U7 X( M+ c" b	标　题 ; S# J4 w& n$ H# p C! F& c; c1 L$ G	title6 [2 f1 a5 p% @3 p' r	主导航 ! H& d8 X0 t. g( _	mainNav 5 V5 }) a( J, Z5 y# ~/ w" a3 j6 u
边导航* D) E1 q+ R9 d3 X1 h: M+ B) G H	sidebar 8 l Z& Y+ ~1 R	左导航5 c. V7 `1 S6 e2 z7 O3 Q$ M$ c	leftsideBar & g2 m- m7 \|# s* q5 e% c% B ?	右导航 0 \|& i3 F b4 v. s	rightsideBar $ u! }4 \|1 \+ `7 c( M
旗　志 - h. M4 \3 s. r6 y. H' U, Q X	logo , x0 G3 T s' x \/ x	标　语 ) Y7 ~1 C$ a; H7 N$ z	banner. P6 @2 _4 Z7 f) {5 D' n6 R, x	菜单内容) m$ k5 i' \|( f4 D2 W	menu1Content & \* W7 J% Z7 m3 s& \3 x
菜单容量 7 f2 k% j) p- c/ D% q' \	menuContainer. `; M e# G) j) \! h	子菜单 ; A+ s2 C4 r. _$ N' `# f1 ?, `	submenu; c8 a6 L+ [6 V, J, B1 U	边导航图标# Y) L! u" \2 O D	sidebarIcon2 m9 ^ y% M/ ?( R9 {; n
注释 4 @( l9 a# [) X; z9 O. w	note( E% X/ v+ f9 `; S7 r+ Z	面包屑 # b/ V9 o) b9 b; C' R! f	breadCrumb ) O2 ^5 [% K; r) \|) v4 u: I4 o	容器% Z3 W7 d2 A6 h$ ?' N! _	container ^. z; \|; Q' q) s- K/ z( \
内容; T! I' D( A0 w' V5 f	content- v1 j1 Z7 q8 A, Z# d; c	搜索 " R {" T0 f* ]9 J) a* f' h h	search- e& W) ~3 k( I0 x% i$ N	登陆2 U' ?& p5 G! ^	login( g- V& a$ J! p5 Z! D
功能区 1 m+ N0 ]* O9 {9 P1 P1 W: ^	shop ( x0 o% V! X2 i6 g7 @' m" P	当前的 " ` E- v& D) [& C5 R	current 7 o) }* B/ m9 X# c6 z8 ^; k	8 \|4 l* o- p3 t' Z. H: b	! I5 t2 ]2 X% b( \|% N% O

inhidgehila · *发表于* 2014-10-1 10:27:26

我有家的感觉~~你知道吗

ofbnbaiinfnh · *发表于* 2014-10-1 10:42:17

貌似我没看懂那~~~

kwjvtwzx · *发表于* 2014-10-1 10:35:31

这日子没法过了....

ofbnbaiinfnh · *发表于* 2014-10-1 11:09:42

怎么就没人拜我为偶像那??

efiew · *发表于* 2014-10-1 11:06:09

什么啊

贾修4762 · *发表于* 2014-10-25 12:53:34

好帖要顶,楼主的头像还是不错滴

登录/注册后可看大图

亮凌庚 · *发表于* 2014-10-31 15:45:06

只是本着“看贴（虽然看不懂）回贴，利人利己的中华民族优秀传统美德”，顺便赚点积分。

ffuip · *发表于* 2014-10-31 15:15:02

嘻嘻~` 要是只看你的话~`~`` 很容易让人家以为你也跟偶们一样是天使类~`（偷笑中````````

亮凌庚 · *发表于* 2014-10-31 15:34:33

估计你是没见识过~` 呵呵

inhidgehila · *发表于* 2014-10-31 16:04:00

呵呵我可不敢~~~~

ofbnbaiinfnh · *发表于* 2014-10-31 15:24:05

呵呵没事怎么有点被讽刺的味道啊

Acropozelan · *发表于* 2014-12-16 09:16:06

怎么这么跟别人不一样类~

Acropozelan · *发表于* 2014-12-16 09:17:54

说嘛1~~~想说什么就说什么嘛~~

wwdu926a · *发表于* 2014-12-16 09:15:33

哈哈 ok ~~~

div+css样式表的id和class常用命名规则

猜你喜欢

回复|共 26 个

回复

浏览过的版块

快捷导航