css写作注意事项:
1.属性写在一行内,属性之间,属性名和值之间,以及属性和“{}”之间要尽量减少空格,去掉最后一个“;”,例如:p{width:100px;height:100px}
2.书写顺序按照由外到内,由整体到细节书写,大致分为5组:
位置:position,left,right,float
盒模型属性:display,margin,padding,width,height,
边框与背景:border,background
段落与文本:font,color,line-height,text...
其他属性:overflow,,,,,
3.带有前缀的属性,单独一行进行缩进,是属性值垂直对齐,便于维护编辑
4.谨慎添加新的选择器的规则,尤其不可滥用id,尽量继承和复用已有的样式
5.最好使用具有语义化的classname和id
6。上下模块之间的间距统一使用下一个模块的margin-top
css命名中英文对照:
current 当前 hover 悬停 selected 挑选 disabled 禁用 focus 得到焦点 blur 失去焦点 checked 勾选 success 成功 error 出错
header(hd) 头部 footer尾部 content(cnt) 内容 title(tit) 标题 item 项目(条) cell 单元 image/pic(img) 图片 text(txt) 文字 top 顶部 scrubber 时序菜单
nav 导航 mainbav 主导航 subnav 子导航 topnav 顶部导航 breadcrumb 面包屑导航
flink 友情链接 footer 尾 copyright 版权
menu 菜单 submenu 子菜单 dropdown 下拉菜单
searchBar 搜索条 search 搜索条 searchTxt 搜索框 searchBtn 搜索按钮 search_key 搜索词
member 会员 ucenter 用户中心 loginBar 登陆条 login 登录 loginBtn 登录按钮 regsiter 注册按钮 btn-regsiter注册按钮 name 用户名 password 密码 nickname 昵称 mobilephone/mobile 手机 telephone/tel 电话 defaultavatar 默认头像
hot 热点 news 新闻 banner/AD 广告 download 下载
content 内容 title 标题 summary 摘要 time 时间
share 分享 digg 顶 like 喜欢
list 列表 pList 图片列表 tList 文字列表 tpList 图文列表
table 表格 row 行 column 列 gutter 间隔 viewport 视口
tab 标签 tags 标签 scroll 滚动
sidebar 侧边栏 column 栏目 section 区块 msg 提示信息 status 状态 vote 投票 tips 小技巧 guild 指南 note 注释
icon- 图标 btn- 按钮
goods 商品 goodsList 商品列表 goodsDetail 商品详情 goodsInfo 商品信息
tuan 团购 tuanList 团购列表 tuanDetail 团购详情 tuanInfo 团购信息
transition 动画 shadow 阴影 fade 淡入淡出 flip 翻页效 slide 滑动 slideup 上滑动 slidedown 下滑动 turn 翻页 horizontal 水平 vertical 垂直 collapsible 折叠 corners 拐角 flow 流 reverse 反向 pop 弹窗
count 总数/计数 plus 加号/正 minus 减号/负 controlgroup 控制组
html命名规范:
default/index.html 首页 404.html 404错误页 print.html 打印页 header.html 页头 footer.html 页脚 sitemap.html 网站地图 passport.html 通行证 rank.html 排行榜 roll.html 滚动新闻 solution.html 解决方案 joinus.html 加入我们 partner.html 合作伙伴 service.html 服务 aboutus.html 关于我们 contact.html 联系我们 company.html 公司介绍 organization.html 组织结构 culture.html 企业文化 strategy.html 发展策略 honor.html 公司荣誉 aptitudes.html 企业资质 events.html 大事记 business.html 商务合作 contract.html 服务条款 privacy.html 隐私声明 CSR.html 企业社会责任 news-开头.html 新闻相关 article-开头.html 资讯相关 picture-开头.html 图片相关 photo-开头.html 相册相关 product-开头.html 产品相关 goods-开头.html 商品相关 system-开头.html 系统相关 tag-开头.html tag相关 brand-开头.html 品牌相关 help-开头.html 帮助相关 member-开头.html 会员相关 search-开头.html 搜索相关
文件夹命名规范:
admin 后台管理 app 应用 article 资讯 common 公共 config 配置 data 数据 digg 顶 en-us 英文 extend 延伸 install 安装 Lang 语言包 Lib 库 mall 商城 picture 组图 product 商品 search 搜索 section 区块 shop 商店 static 静态 system 系统 templates 模版 tuan 团购 ucenter 用户中心 upload 上传 video 视频 vote 投票 zh_tw 繁体中文 zh-cn 简体中文