返回列表 发新帖

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

3,160.4k 26
开着越野放牛 发表于 2013-6-14 21:01:28|湖北 | 查看全部 阅读模式
div+css样式表的id的常用命名规则如下表所示:
页头
8 B) h$ N& D  Q' m* Q# ~7 q7 Q& B
header7 _5 m$ N8 m9 q) C7 t1 |
登录条
8 c) s) L: ]  {, D1 N9 m
loginBar8 b! b7 J/ l: S7 i4 Q6 f$ F
标志
: {6 D; n8 |4 ~& f
logo+ A4 V  P' k7 W( {
侧栏
9 i' J5 S, c" b+ v2 b3 N
sideBar
5 D5 J/ K& D3 A" u. c( A
广告9 O5 w9 v; t' i  M
Banner2 Q, y6 Y1 r) x# @3 @
导航
& m5 q* j; X# U: C' f9 n
nav" @% |, E% x4 t# Q
子导航
- W+ i! p  \8 J& c& ]
subNav8 W/ o) u( L! k( O* ]
菜单
5 q0 q& D1 o0 z
menu- x! A: M6 b- [" [9 l9 d
子菜单" M$ g8 q+ B* r. s8 n; M
subMenu
) n$ p1 d8 `6 _  \7 _
搜索: f9 t+ k7 l4 P2 G' e2 o
search
; y. X; Y0 B8 ]
滚动
$ y; l: r+ J' D6 |) c2 Y: K
scroll1 ?# Y* X. T4 Y% s( O( K  R  m
页面主体7 d+ s4 g* S' {( \. ?
main
2 |( V1 J* _7 }
内容4 |& U& D+ g+ {: r
content5 R3 e) ?% A* h+ j" ?$ p, O
标签页! \# \; Q( o3 U' ^; ^- u0 N1 d
tab; O& o. k* B0 ~; O9 k1 m
文章列表+ j! Q! M/ L. u* m6 n9 o
list$ {& B8 L  d1 {4 j2 |
提示信息" A, \0 I- g& ^/ O" E
msg& V: j; X5 A# G3 b3 n8 X
小技巧
- X% S* m3 O5 E+ n: q; t; `
tips
! r6 A$ s5 X" v
栏目标题
- Y! b/ J9 z  U5 h0 O3 V6 ?
title. x: p& o1 N  ~7 E
加入
; t7 l. J; A, \8 m1 b+ ?
joinus
$ r2 R* n2 U7 G/ [3 ~, I
指南
0 D, D5 N/ q: ~5 B/ [
guild
+ ?$ [( h9 V0 p% A4 B' t
服务
4 e* l6 X- \& z
service
- n* ?) s! Y6 j# Y
热点8 I$ y" u; L+ ~1 v
hot
- i6 j# V7 y3 M2 B/ m
新闻
6 o6 ^, [; D4 f. E, ?% D  G( k
news! Q0 t1 P# ]# L- J
下载7 ^7 N3 Q, U8 ]- q9 Z
download% e6 s% A6 }7 @& B, k6 h4 L! P) O; c
注册$ x0 k! ~* R# g, M6 R
regsiter: `' d! @# p+ A& K
状态" q: U- d! p! v% @8 R3 i0 h
status
1 K; j- q- d2 t. a
按钮- A. X! F$ P0 l; Q
btn# U. j* t* W, ]$ O! s! a. @' y
投票7 r& U/ s9 g! y
vote0 X3 M7 M, I8 x6 D; O7 H
合作伙伴4 W- r6 l# ~0 ?( Z- j9 q' u6 T
partner
* ^# m' D5 g! f) x% \: R- X% a1 P
友情链接
2 d4 ?5 k9 W. w% k$ K
friendLink
5 p( l5 G8 C) m$ ?- n* G& |
页脚
; A+ m& W9 n4 ?! O* y( E2 g0 d. d
footer
' B9 j3 l9 [; n9 u6 o3 M
版权
9 A$ k1 A3 A5 e& s! j" s0 U, u
copyRight, C# A+ n5 A4 ?# O, w" L8 V

1 {" u7 T5 i1 w. L! l

/ q# m7 y$ f+ s$ A
2 Y7 ?5 X8 `" P5 k
div+css样式表的class的常用命名规则如下表所示:
外 套
; G& }& r- i3 ]8 c& n  F3 a  M
wrap, l( W- `% f. o$ u
主导航
; k( G& J) d3 I
mainNav8 g: D+ w4 L8 n# {/ D0 I+ p; p9 `
子导航& P0 B, q% g+ c7 {' g( {% i
subnav
7 N2 G) N! A" l
页 脚% m, V- s  F5 y% c: f) B" l8 O
footer
/ N& y4 C, l. k% E
整个页面8 W1 s! W9 y- L" O. Y. @3 D
content# s2 E2 S1 M3 T8 c, n0 |* u
页 眉4 l9 `! k: {; E5 D1 s/ V
header/ L- G% @( }$ p5 S( \4 Q
商 标
7 E: z  p3 @8 b' r! R
label  V9 |2 k/ E) o6 L
标 题
5 L: Y, q( t: d! k& l) D
title
) b# x* ?" e4 E) v6 i  J
主导航
" a0 X1 v, v6 I9 w0 l
mainNav* v+ s! M6 j/ c; D# s* d
边导航2 j/ T$ u* [/ e; z( A- n6 V" v
sidebar( R/ u- |: D" Z' \5 i
左导航, N5 _3 V2 w) I# t
leftsideBar
" A, v# q& B& x3 b+ ?
右导航
% k  m8 n" i+ `( G; h
rightsideBar$ ]% T  F, a- d7 L! O6 u
旗 志' a( Z9 m$ X- D% ^6 d# b+ `5 ]; z
logo. l9 ^1 b* o& T& n
标 语
$ y! f1 j6 V5 J/ @
banner
7 }4 A+ ?& d7 Y! f7 g- `
菜单内容
' G( V/ h" Z7 P; P2 F. b8 c
menu1Content
/ w) a7 X  L" V& H+ H- m
菜单容量
' j3 ^" g  o' P0 b# f
menuContainer8 V4 Z+ f8 b8 D8 K" d, o
子菜单
7 m; Z8 f2 l2 |
submenu
6 m' D8 b! S4 H. A8 T% q% n% a
边导航图标( |* f4 g/ }3 a1 y
sidebarIcon
; ], H, ?! L: s) X
注释
+ G# k% ^8 l$ c  [9 c
note: @, ^1 A( o! |& z, H
面包屑! f+ a6 b$ ]- m7 y
breadCrumb2 P3 G1 u7 H& e+ m3 g
容器: `6 `$ z8 z+ _
container2 L) @& z6 O: i3 V5 j# `  B
内容6 G+ F/ a; `. M8 g
content
( O  c9 Y/ @" Q2 [0 L  {5 q
搜索3 D/ j: Y# J9 q, s* g; k% G
search6 D7 ^/ @) U* q. f  _
登陆4 M  J; I2 x% `" J+ g2 ^- g7 {5 r
login
: S$ b+ f0 j& R# l2 S
功能区
8 K! I8 I3 Y. a: L! c. v
shop1 v9 C. y  \5 K$ c
当前的
7 x( u/ }& Z; ^
current
8 w# d/ \/ h: q, h' G; a) Q

! Z, G0 A/ u1 ?9 {. n) X
* s9 T: V  d- u
8 K3 |& P. `5 O1 k9 }- b

: Y& a# ^& r0 n& G, _6 @' I5 S: L7 Q. L

回复|共 26 个

inhidgehila Lv.8 发表于 2014-10-1 10:27:26|美国 | 查看全部
我有家的感觉~~你知道吗
ofbnbaiinfnh Lv.8 发表于 2014-10-1 10:42:17|美国 | 查看全部
貌似我没看懂那~~~
kwjvtwzx Lv.15 发表于 2014-10-1 10:35:31|美国 | 查看全部
这日子没法过了....
ofbnbaiinfnh Lv.8 发表于 2014-10-1 11:09:42|德国 | 查看全部
怎么就没人拜我为偶像那??
efiew Lv.15 发表于 2014-10-1 11:06:09|美国 | 查看全部
什么啊
贾修4762 Lv.6 发表于 2014-10-25 12:53:34|北京 | 查看全部
好帖要顶,楼主的头像还是不错滴
# Q. T1 N; v0 ^6 z
                               
登录/注册后可看大图
! E* p# k9 n1 n+ `* }
                               
登录/注册后可看大图
$ j! i" E% W6 n. m
                               
登录/注册后可看大图
4 O; `( E) \3 l8 |! U& V" b
                               
登录/注册后可看大图

0 U9 q$ J) _) `- b8 Z, y                               
登录/注册后可看大图

# F8 ?! C+ g" `# F( U# j) ?                               
登录/注册后可看大图

# k$ c( f& f7 t9 A9 U. Z                               
登录/注册后可看大图

. g# V0 Z+ D7 ]7 e  b1 {                               
登录/注册后可看大图

1 y6 c6 O+ B6 N5 ^& k, k' I                               
登录/注册后可看大图
+ P6 X) l3 Y4 n9 g+ j; x8 a
                               
登录/注册后可看大图
, p5 w7 q% k6 L) A) X" ]% k2 S
                               
登录/注册后可看大图

' l& W) N' U8 e                               
登录/注册后可看大图
' C9 X+ y: E* j- r7 {. G: s' I
                               
登录/注册后可看大图
  z; O; j0 M' D; e) d
                               
登录/注册后可看大图
3 D$ ]( I' B' [4 a
                               
登录/注册后可看大图
亮凌庚 Lv.15 发表于 2014-10-31 15:45:06|中国 | 查看全部
只是本着“看贴(虽然看不懂)回贴,利人利己的中华民族优秀传统美德”,顺便赚点积分。
ffuip Lv.8 发表于 2014-10-31 15:15:02|加拿大 | 查看全部
嘻嘻~` 要是只看你的话~`~`` 很容易让人家以为你也跟偶们一样是天使类~`(偷笑中````````
亮凌庚 Lv.15 发表于 2014-10-31 15:34:33|INNA | 查看全部
估计你是没见识过~` 呵呵
inhidgehila Lv.8 发表于 2014-10-31 16:04:00|意大利 | 查看全部
呵呵 我可不敢~~~~
ofbnbaiinfnh Lv.8 发表于 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 ~~~

回复

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

得知互动是一个融创意、设计、开发、营销、生活、互联网于一体的专业交流分享平台。
Copyright © 2026 得知互动-专注Ai与站长技术交流社区-Ai交流平台 版权所有 All Rights Reserved. Powered by Discuz! X5.0 鄂ICP备15006301号-5|鄂公网安备 42018502006730号
关灯 在本版发帖 扫一扫添加QQ客服 返回顶部
快速回复 返回顶部 返回列表