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

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

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

页头 $ g _! y; F5 [# ]1 C. X	header - D5 M6 ^% K$ ~' P5 R	登录条1 c8 T \4 x1 A5 T	loginBar ' T7 V: y9 A6 H7 V4 A	标志, \5 w4 i" \+ o5 P( R3 B	logo* {: T6 N6 ~& `8 A2 n
侧栏7 E$ { ?9 a W9 c1 }8 o	sideBar1 b; d. U% v y0 p	广告 " d* K! U1 L- R6 m8 }	Banner . \% g9 i( F) X1 L0 k: c4 j$ e' n" p	导航+ s7 l/ p& B- N" g7 S	nav; h3 F/ v% c3 O; T# m
子导航: Y0 C+ _% n$ a0 S* z3 B5 r	subNav x: W( t2 R' {$ o/ ~8 V; I" l	菜单/ a$ p6 {6 z) M	menu - o2 I- g' \0 G) O6 F2 B	子菜单 # F2 p% P4 A- v& R! t	subMenu) o! v' A+ s8 z5 r
搜索; g- m7 ^/ L' m4 N/ n5 b% b# U+ g	search - f9 M+ u& h& @" D	滚动 1 D) q, ^3 a& o! p0 _	scroll5 F; i5 M4 \|" g) D4 H0 d6 m	页面主体2 H1 G" Q% k, V	main- W4 f$ B* d! q5 \. [9 s
内容 % k5 Y% A# y; T7 K+ \9 U	content $ \. ?5 k5 j+ u	标签页 8 v3 w) n+ \& h- Y A6 ]3 w! m& r	tab$ O8 m3 D+ [) W' H) r7 ]7 M	文章列表; C* l# [; N( r# t! t3 f	list ( M) r. D5 B/ b7 D' d/ g6 a
提示信息6 Q0 _6 S1 H ]' S& V6 Y2 F( g	msg: X; E4 H# q6 ]. M	小技巧& S# k2 k4 O) d: x* A, N7 n" w6 x	tips * `0 e7 j" L C% e- S. F	栏目标题 & m7 T+ G8 ^3 n1 r- g" G- U) i% p	title 0 A* E4 Y+ v% H( k( f' [4 O4 f
加入 3 g/ \$ y" X/ b: ?5 E* A c	joinus & r% }6 }& O& p6 g9 @: X9 c	指南! W; U$ a7 c9 f& l7 I0 J# \	guild0 A! o4 F6 ^4 P	服务 0 H, D; @" o3 R: d* n	service8 ~/ ~. w8 s4 B1 z6 H
热点, }% E: h0 _) l2 N4 ?6 q	hot$ B4 L3 v( j2 [	新闻 $ y; U) v0 B# ^. u4 K H& P" U	news 4 n, \$ P. z* M2 O& b9 f+ f/ D	下载 , s i! a3 o" n	download0 @5 f& P' `/ ]* Y8 O( n4 N
注册5 W# J- @+ X5 O+ X& K( H+ z	regsiter ; @7 y- b p. k	状态 % I3 C7 t' N& q. H8 ^	status 8 T4 E6 G4 G4 W) _/ R	按钮2 I/ V" ]3 A* s% F	btn5 n* K8 z1 [# f) H
投票# D2 E7 \ ]3 e; ~4 B	vote3 j- y5 \$ n$ v$ j) b- _	合作伙伴 % j* `3 p0 G5 j2 w	partner: J/ p( U* T' p* b' A9 ?	友情链接4 f) t+ E9 ]9 `% N$ O% S: F3 }	friendLink4 R, x$ D/ Y/ I3 U& _
页脚0 e$ b; q+ k1 L: K3 z	footer( r* \|6 {5 r* K6 e& g	版权 {8 h: p; q4 K+ S/ U	copyRight 7 z6 v& n2 O5 R I	1 s& n6 f2 i; \. D& w	3 v& l! _( x; P# e

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

外　套1 G' D) h! t Q	wrap $ I4 i- T& _' c0 ~3 S, q	主导航5 c+ t( O" I7 g- [	mainNav 7 ~. S% m8 c" Y3 O4 Y% j# m; u	子导航 . u( i3 x) y* p	subnav; F1 u% `& }- s+ J& R
页　脚 . g" t( B/ c8 }3 J	footer$ N o5 A; n2 e$ p# t6 G. d	整个页面 @9 Q0 h7 o1 }/ R' x	content 7 z$ o+ ?8 ^7 `	页　眉 + p; T- \2 ^, A5 Y; ~* m5 Q	header: u; L7 C ` d( e5 ?* R6 O
商　标0 h* d6 P( D) I+ N) X	label / \% i6 Z( z( r8 `	标　题7 Q+ M% ^; @* @	title; _9 c# I5 D" \|	主导航7 n* m, ~+ J8 [	mainNav $ o8 s" g% d4 [( I6 j
边导航 9 V1 I/ c4 y( H' I F& j+ Z9 Y	sidebar ) \, O7 _% Z' m- a; h: T1 k	左导航 ) k1 X2 p! t5 S1 M% F# U	leftsideBar0 Q3 N' U: m1 `2 u* }* e) g+ }! L Q	右导航) k4 n1 G9 P' f% k	rightsideBar ; V; l" S- d$ d& B: \9 \|% h1 a# X
旗　志 - X+ a& T9 D5 ~$ I	logo5 Q% O/ R7 M. D. \|! C. b	标　语 # N, O3 F2 w# F; ]. P- P	banner+ Q/ \|8 ?4 D- P6 l' l6 ~3 F5 b	菜单内容 , G6 \|' k$ e5 M- {	menu1Content/ _1 P1 T8 \8 \" U/ o/ y
菜单容量# t ^% ]/ B* D, k$ \( b3 o+ z	menuContainer 7 f& O) [4 O1 I4 h0 x	子菜单" a5 s* B+ g/ K& F% [; v# E	submenu8 B1 H, N9 [4 ~1 I2 `$ A- A	边导航图标 0 M1 [9 z5 r( e l' U2 j0 ?	sidebarIcon . S; ?8 ~) b ]( e) ?# n
注释 , h' r) S! R3 R# D$ r	note3 Q8 W0 z6 A# o g	面包屑9 x$ P' h3 e' s( V' s	breadCrumb. D4 _3 ^1 d# y8 @2 Q! y' ^$ M* r	容器 ! o# g" h G) n8 o V	container 7 m2 t4 l' P$ h) l0 {! e7 O! b
内容" J* N- N }- E; c6 H! R	content # P+ V! P" f. l9 n6 I4 ^) B A% N	搜索 ( K- ~' K( [: s; K	search- P, a* s/ ?( p	登陆# S7 q( `4 P" ]0 h	login( e0 T! G2 h, j+ X! J( m
功能区 q s' T' n# {7 ^' \& _9 E	shop: h) H0 S3 t9 Z. m	当前的 ' z3 @; R H* ^- E$ h) a	current* Y; z' a6 K2 u+ B6 f	! _6 O$ a/ H0 ~* K	! B, n' _" g* j. k

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 个

回复

快捷导航