• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >心得技巧 > HTML,CSS的命名习惯总结

HTML,CSS的命名习惯总结

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含命名习惯等相关知识,佚名 希望在学习及工作中可以帮助到您
CSS命名规则
头:header
内容:content/containe
尾:footer
导航:nav
侧栏:sidebar
栏目:column
页面外围控制整体布局宽度:wrapper
左右中:left right center
登录条:loginbar
标志:logo
广告:banner
页面主体:main
热点:hot
新闻:news
下载:download
子导航:subnav
菜单:menu
子菜单:submenu
搜索:search
友情链接:friendlink
页脚:footer
版权:copyright
滚动:scroll
内容:content
标签页:tab
文章列表:list
提示信息:msg
小技巧:tips
栏目标题:title
加入:joinus
指南:guild
服务:service
注册:regsiter
状态:status
投票:vote
合作伙伴:partner
XHTML文件中id的命名
(1)页面结构
容器: container
页头:header
内容:content/container
页面主体:main
页尾:footer
导航:nav
侧栏:sidebar
栏目:column
页面外围控制整体布局宽度:wrapper
左右中:left right center
(2)导航
导航:nav
主导航:mainbav
子导航:subnav
顶导航:topnav
边导航:sidebar
左导航:leftsidebar
右导航:rightsidebar
菜单:menu
子菜单:submenu
标题: title
摘要: summary
(3)功能
标志:logo
广告:banner
登陆:login
登录条:loginbar
注册:regsiter
搜索:search
功能区:shop
标题:title
加入:joinus
状态:status
按钮:btn
滚动:scroll
标签页:tab
文章列表:list
提示信息:msg
当前的: current
小技巧:tips
图标: icon
注释:note
指南:guild
服务:service
热点:hot
新闻:news
下载:download
投票:vote
合作伙伴:partner
友情链接:link
版权:copyright
XHTML文件中class的命名
(1)颜色:使用颜色的名称或者16进制代码,如(不建议以表现来命名)
.red { color: red; }
.f60 { color: #f60; }
.ff8600 { color: #ff8600; }
(2)字体大小,直接使用"font+字体大小"作为名称,如
.font12px { font-size: 12px; }
.font9pt {font-size: 9pt; }
(3)对齐样式,使用对齐目标的英文名称,如
.left { float:left; }
.bottom { float:bottom; }
(4)标题栏样式,使用"类别+功能"的方式命名,如
.barnews { }
.barproduct { }
其它相关注意事项
1.一律小写;
2.尽量用英文;
3.不加中杠和下划线;
4.尽量不缩写,除非一看就明白的单词.
主要的 master.css
模块 module.css
基本共用 base.css
布局,版面 layout.css
主题 themes.css
专栏 columns.css
文字 font.css
表单 forms.css
补丁 mend.css
打印 print.css

您可能想查找下面的文章:

相关文章

  • 2017-08-06在FireFox中导入导出Cookies与收藏夹的解决办法
  • 2017-08-0625个CSS框架、工具、软件及样板分享
  • 2018-08-23学会改作品集之后,我收到的Offer 多了一倍
  • 2018-08-23这7个实用的设计技巧,能让你的UI高级感更强烈
  • 2018-08-23毕业生来收!国内顶级设计大厂的春招流程+经验总结
  • 2018-08-23做好这个交互文档细节,让你和工程师的合作效率提高50%
  • 2018-08-23解析 iOS 11:苹果还像过去一样在意细节吗?
  • 2017-08-06符合w3c标准的html标准需要注意的地方详解
  • 2018-08-23老妈,才是那个最难搞的甲方!
  • 2018-08-23《小偷家族》中国版海报看哭日本观众,这届中国设计很能打!

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 关于遇到的浏览器兼容问题及应对方法(推荐)
    • Web前端开发者必知的9个实用CSS属性
    • 水彩自学第四集:水彩颜料常见问题和自用测评
    • 限制input输入类型(多种方法实现)
    • 在配色这件事情上,总会有一些有趣且有用的小技巧
    • 修改网页中的FlashSWF文件的方法
    • 如何减少操作步骤?我总结了这3个方法!
    • 网站界面设计中为网站创建风格指南的方法(图文)
    • 「这个控件叫什么」系列之输入框/文本框/Text fields
    • 如何做好 Banner设计?我总结了这4类基础知识

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有