- 浏览: 346123 次
- 性别:
- 来自: 保定
文章分类
- 全部博客 (266)
- ERP (69)
- ERP-SAP-MM (50)
- ERP-SAP-FICO (23)
- ERP-SAP-HR (2)
- ERP-SAP-HU (1)
- ERP-SAP-BASIS (4)
- ERP-SAP-EWM (2)
- div+css (34)
- flex (9)
- 网页设计理论 (17)
- 网页代码理论 (1)
- 网页代码技巧 (12)
- UI设计理论 (6)
- flash (3)
- 界面设计 (14)
- 数码照片处理 (7)
- 影像处理 (1)
- logo设计 (3)
- 测试 (6)
- 习惯性思维 (6)
- 心情日记 (14)
- 印刷 (3)
- seo优化 (5)
- 人力资源eHR管理 (3)
- 项目管理相关链接 (1)
- PPT演示沟通 (5)
- 项目管理 (4)
- TAMM40_Part2.rar (1)
- SAP VIM (1)
- SAP使用公司 (1)
- 会计 (1)
- erp-sap-qm (1)
- WEB前端 (0)
最新评论
-
liomao:
火狐浏览器不通用吧?
收藏本站代码及设为首页代码 -
上善如水:
我刚刚开始写网页,看了不少的写作规范写作规范,可是还是有浏览器 ...
UL-LI 标签结合CSS的运用基础 -
ksmjava:
关于技术人员的前途,目前在国内确实得用"惨淡&quo ...
WEB前端设计师需要的技能 -
AlexChen_China:
Web开放工具是如此的丰富啊...初来乍道很多工具都不知道;
前端开发大众手册(包括工具、网址、经验等) -
xiaoqing20:
不错长见识了
什么是UI
1.CSS ID 的命名
外 套: wrap
主导航: mainnav
子导航: subnav
页 脚: footet
整个页面: content
页 眉: header
页 脚: footer
商 标: label
标 题: title
主导航: mainbav(globalnav)
顶导航: topnav
边导航: sidebar
左导航: leftsidebar
右导航: rightsidebar
旗 志: logo
标 语: banner
菜单内容1: menu1 content
菜单容量: menu container
子菜单: submenu
边导航图标:sidebarIcon
注释: note
面包屑: breadcrumb(即页面所处位置导航提示)
容器: container
内容: content
搜索: search
登陆: Login
功能区: shop(如购物车,收银台)
当前的 current
2.另外在编辑样式表时可用的注释可这样写:
<-- Footer -->
内容区
<-- End Footer -->
3.样式文件命名
主要的 master.css
布局,版面 layout.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css
注:来源于“烟儿圈教程网”
css命名:
页头:header
登录条:loginbar
标志:logo
侧栏:sidebar
广告:banner
导航:nav
子导航:subnav
菜单:menu
子菜单:submenu
搜索:search
滚动:scroll
页面主体:main
内容:content
标签页:tab
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
加入:joinus
指南:guild
服务:service
热点:hot
新闻:news
下载:download
注册:regsiter
状态:status
按钮:btn
投票:vote
合作伙伴:partner
友情链接:friendlink
页脚:footer
版权:copyright
3.样式文件命名
基本的 base.css
主要的 master.css
布局,版面 layout.css
局部 part.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css
4.缩写命名
左浮 fl = float:left;
右浮 fr = float:right;
清楚浮动 clear = clear:both;
左对齐 tl = text-align:left;
右对齐 tri = text-align:right;
居中 tc = text-align:center;
宽度 w1(width) = 1px……..w1000 = 1000px
高度 h1(height) = 1px……..h1000 = 1000px
清楚边框 bd_n = border:none!important;
加粗 fw_b = font-weight:bold;
清楚加粗 fw_n = font-weight:normal;
隐藏块 dp_n = disipay:none;
显示块 dp_b = disipay:block;
清楚背景色 bg_n = background:none;
外边距(上右下左) m_05 = margin:5px;
外边距(上下左右) m_0510 = margin:5px 10px;
外边距(上左右下) m_051007 = margin:5px 10px 7px;
外边距(上) mt_10 = margin-top:10px;
外边距(右) mr_10 = margin-right:10px;
外边距(下) mb_10 = margin-bottom:10px;
外边距(左) ml_10 = margin-left:10px;
内边距(上右下左) p_05 = padding:5px;
内边距(上下左右) p_0510 = padding:5px 10px;
内边距(上左右下) p_051007 = padding:5px 10px 7px;
内边距(上) pt_10 = padding-top:10px;
内边距(右) pr_10 = padding-right:10px;
内边距(下) pb_10 = padding-bottom:10px;
内边距(左) pl_10 = padding-left:10px;
如:<div class="fl h100">www.hemin.cn</div>//适合做大型网站重复调用样式
5.颜色命名
黑色 black = #000
白色 white = #FFF
灰色 gray = #999 #666 #333
红色 gules = #F00
黄色 yellow= #FF0
蓝色 blue = #00F
绿色 green = #0F0
青色 cyan = #0FF
紫色 purple= #F0F
缩写 #F0F = #FF00FF
如:<div><a href="#">hm</a><a class="gules" href="#">hemin</a></div> 皆可
外 套: wrap
主导航: mainnav
子导航: subnav
页 脚: footet
整个页面: content
页 眉: header
页 脚: footer
商 标: label
标 题: title
主导航: mainbav(globalnav)
顶导航: topnav
边导航: sidebar
左导航: leftsidebar
右导航: rightsidebar
旗 志: logo
标 语: banner
菜单内容1: menu1 content
菜单容量: menu container
子菜单: submenu
边导航图标:sidebarIcon
注释: note
面包屑: breadcrumb(即页面所处位置导航提示)
容器: container
内容: content
搜索: search
登陆: Login
功能区: shop(如购物车,收银台)
当前的 current
2.另外在编辑样式表时可用的注释可这样写:
<-- Footer -->
内容区
<-- End Footer -->
3.样式文件命名
主要的 master.css
布局,版面 layout.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css
注:来源于“烟儿圈教程网”
css命名:
页头:header
登录条:loginbar
标志:logo
侧栏:sidebar
广告:banner
导航:nav
子导航:subnav
菜单:menu
子菜单:submenu
搜索:search
滚动:scroll
页面主体:main
内容:content
标签页:tab
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
加入:joinus
指南:guild
服务:service
热点:hot
新闻:news
下载:download
注册:regsiter
状态:status
按钮:btn
投票:vote
合作伙伴:partner
友情链接:friendlink
页脚:footer
版权:copyright
3.样式文件命名
基本的 base.css
主要的 master.css
布局,版面 layout.css
局部 part.css
专栏 columns.css
文字 font.css
打印样式 print.css
主题 themes.css
4.缩写命名
左浮 fl = float:left;
右浮 fr = float:right;
清楚浮动 clear = clear:both;
左对齐 tl = text-align:left;
右对齐 tri = text-align:right;
居中 tc = text-align:center;
宽度 w1(width) = 1px……..w1000 = 1000px
高度 h1(height) = 1px……..h1000 = 1000px
清楚边框 bd_n = border:none!important;
加粗 fw_b = font-weight:bold;
清楚加粗 fw_n = font-weight:normal;
隐藏块 dp_n = disipay:none;
显示块 dp_b = disipay:block;
清楚背景色 bg_n = background:none;
外边距(上右下左) m_05 = margin:5px;
外边距(上下左右) m_0510 = margin:5px 10px;
外边距(上左右下) m_051007 = margin:5px 10px 7px;
外边距(上) mt_10 = margin-top:10px;
外边距(右) mr_10 = margin-right:10px;
外边距(下) mb_10 = margin-bottom:10px;
外边距(左) ml_10 = margin-left:10px;
内边距(上右下左) p_05 = padding:5px;
内边距(上下左右) p_0510 = padding:5px 10px;
内边距(上左右下) p_051007 = padding:5px 10px 7px;
内边距(上) pt_10 = padding-top:10px;
内边距(右) pr_10 = padding-right:10px;
内边距(下) pb_10 = padding-bottom:10px;
内边距(左) pl_10 = padding-left:10px;
如:<div class="fl h100">www.hemin.cn</div>//适合做大型网站重复调用样式
5.颜色命名
黑色 black = #000
白色 white = #FFF
灰色 gray = #999 #666 #333
红色 gules = #F00
黄色 yellow= #FF0
蓝色 blue = #00F
绿色 green = #0F0
青色 cyan = #0FF
紫色 purple= #F0F
缩写 #F0F = #FF00FF
如:<div><a href="#">hm</a><a class="gules" href="#">hemin</a></div> 皆可
发表评论
-
精通 CSS 造型设计元素
2010-01-20 13:35 1263CSS 是现代网页设计的重要基石。Web 标准要求使用 CSS ... -
你必须知道的10个不常用的HTML标签
2009-09-10 21:31 944http://www.qianduan.net/you-hav ... -
wofoo表单模板下载
2009-09-10 21:01 845http://wufoo.com/gallery/ -
加个地址栏图标
2009-08-23 21:56 762<link rel="shortcut ico ... -
解决IE8兼容性问题的便捷方法
2009-08-20 09:19 1203微软告知我们:在目前兼容IE 7 的网站上只需添加一行代码(加 ... -
div垂直居中
2009-08-20 08:08 935position: absolute; width:880 ... -
标准化良构之路
2009-08-10 15:24 811专题:标准化良构之路 标准化走到今天,当CSS被我们充分的接 ... -
使用CSS为图片添加更多趣味的5种方法.
2009-07-17 23:38 10711, 阴影效果. 通过使用带有一些padding之的背景 ... -
Blueprint CSS 框架学习笔记概述
2009-07-17 23:34 1547这个 CSS 框架将 html 标签设定为如下情况: 统一 ... -
CSS框架思维雏形与CSS文件精简
2009-07-17 23:31 884假如在你切完所有图之后,假如你切的网站是娱乐性的网站.(重复性 ... -
CSS BUG顺口溜
2009-07-16 22:23 877CSS BUG顺口溜 一、IE边框若显若无,须注意,定是高度 ... -
用CSS替换传统方法
2009-07-16 18:16 836下面的列表将帮助你用CSS替换传统方法: HTML属性以及相对 ... -
UL-LI 标签结合CSS的运用基础
2009-07-16 13:46 1494LI代码的格式化: A).运用CSS格式化列表符: ul l ... -
css相关工具
2009-07-16 13:45 984附加 工具 http://www.ziuo.cn/box/c ... -
Css单词英汉对照
2009-07-16 13:44 986margin:页边的空白, (湖、池等的)边缘, 极限, 利润 ... -
Web标准概念--摘抄《CSS布局实录》
2009-07-16 13:43 1037前言 对于日常的很多事情,我们并没有注意到这背后都有着一个隐藏 ... -
用CSS做一个最简单的导航栏
2009-07-16 13:41 1483导航栏是网页中常用的模块,有很多方法可以实现,下面是用css实 ... -
Iframe高度自适应
2009-07-16 13:41 837<iframe width="190" ... -
css背景渐变的技巧与方法
2009-07-16 13:40 2495用css实现网页背景渐变的代码如下: 一、从上往下渐变 ... -
网页布局中常用的列表元素ul ol li dl dt dd讲解
2009-07-16 13:39 1977DIV CSS网页布局中常用的列表元素ul ol li dl ...
相关推荐
div+css命名规范 初学者可以看看 规范的命名方式
DIV+CSS命名规范
DIV+CSS规范命名大全集合
v页头:header 登录条:loginBar 标志:logo 侧栏:sideBar 广告:banner 导航:nav 子导航:subNav 菜单:menu 子菜单:subMenu 搜索:search 滚动:scroll
为了更加符合SEO的规范,下面是目前前端开发流行的CSS+DIV的命名规则:
...
...
主要汇总介绍了DIV+CSS命名规范,十分的全面,也很详细,推荐给想学习DIV+CSS的小伙伴们。
【DIV+CSS学习笔记】CSS样式命名规范
适合初学者的39个div+css网页布局例子, 可以了解CSS命名规范,DIV+CSS布局方法, 三栏,二栏,多栏复杂型布局例子.
DIV+CSS规范命名集合.pdf
...
...
DIV+CSS 英文命名规范
搜索引擎优化(seo)有很多工作要做,其中对代码的优化是一个很关键的步骤。为了更加符合SEO的规范,下面是目前流行的CSS+DIV的命名规则:
DIV+CSS命名规范有助于SEO
css资料大全 有div+css案例 css参考手册 布局 div+css命名规范 网页配色
常用的CSS命名规则: 头:header 内容:content/container 尾:footer 导航:nav ...