页面结构
| 中文 |
英文 |
简写 |
| 布局 |
layout |
- |
| 栅格 |
grid |
- |
| 排版 |
typography |
- |
| 组件 |
component |
- |
| 容器 |
container |
- |
| 头 |
header |
- |
| 侧栏 |
sidebar |
- |
| 主体 |
main |
- |
| 脚 |
footer |
- |
| 行 |
row |
- |
| 栏，栏目 |
column |
col |
| 页面外围控制整体布局宽度 |
wrap |
- |
| 内容 |
content |
- |
导航
| 中文 |
英文 |
简写 |
| 导航 |
navgation |
nav |
| 子导航 |
subnav |
- |
| 菜单 |
menu |
- |
| 子菜单 |
submenu |
- |
| 下拉菜单 |
dropdown |
- |
| 条目 |
item |
- |
| 标题 |
title |
- |
| 面包屑 |
breadcrumb |
- |
组件
| 中文 |
英文 |
简写 |
| 轮播图 |
carousel |
- |
| 提示点 |
indicator |
- |
| 步骤条 |
step |
- |
| 标签页 |
tab |
- |
| 表单 |
form |
- |
| 输入框 |
input |
- |
| 多选 |
checkbox |
- |
| 单选 |
radio |
- |
| 开关 |
switch |
- |
| 时间选择 |
datepicker |
- |
| 日历 |
calendar |
- |
| 折叠面板 |
collapse |
- |
| 气泡卡片 |
popover |
- |
| 气泡确认 |
popconfirm |
- |
| 进度 |
progress |
- |
| 进度条 |
progressbar |
progress |
| 加载中 |
spin |
- |
| 模态框 |
modal |
- |
| 文字提示 |
tooltips |
- |
| 评分 |
rate |
- |
| 卡片 |
card |
- |
| 表格 |
table |
- |
页面元素
| 中文 |
英文 |
简写 |
| 标志 |
logo |
- |
| 搜索 |
search |
- |
| 横幅 |
banner |
- |
| 摘要 |
summary |
- |
| 关于 |
about |
- |
| 友情链接 |
friendlink |
- |
| 关于、关于我们 |
about |
- |
| 版权 |
copyright |
- |
| 列表 |
list |
- |
| 滚动 |
scroll |
- |
| 消息 |
message |
msg |
| 公告 |
notice |
- |
| 信息 |
information |
info |
| 加入 |
join |
- |
| 加入我们 |
joinus |
- |
| 状态 |
status |
- |
| 当前 |
current |
- |
| 小技巧 |
tips |
- |
| 指南 |
guide |
- |
| 图标 |
icon |
- |
| 服务 |
service |
- |
| 主题 |
theme |
- |
| 注释 |
note |
- |
| 新闻 |
news |
- |
| 热点 |
hot |
- |
| 合作伙伴 |
partner |
- |
| 链接 |
link |
- |
| 密码 |
password |
passwd |
| 标签 |
tag |
- |
| 值 |
value |
- |
| 优惠券 |
coupon |
- |
| 货品 |
goods |
- |
| 商品 |
product |
- |
| 购物车 |
cart |
- |
| 商店 |
shop |
- |
| 色板 |
palette |
- |
| 字体 |
font |
- |
| 文字 |
text |
- |
| 资料 |
profile |
- |
| 头像 |
avatar |
- |
| 名称、姓名 |
name |
- |
| 昵称 |
nickname |
- |
| 个人简介 |
biography |
bio |
| 作者 |
author |
- |
| 年龄 |
age |
- |
| 地址 |
location、address |
- |
| 手机 |
phone |
- |
| 电话 |
telephone |
tel |
| 积分 |
score |
- |
| 网站、网址 |
website |
- |
| 任务 |
task |
- |
| 勋章、徽章 |
badge |
- |
| 工具 |
tool |
- |
| 图片 |
image |
img |
操作
| 中文 |
英文 |
简写 |
| 下载 |
download |
- |
| 上传 |
upload |
- |
| 分享 |
share |
- |
| 赞、点赞 |
like |
- |
| 收藏 |
collect |
- |
| 举报 |
report |
- |
| 编辑 |
edit |
- |
| 删除 |
delete |
del |
| 移动 |
move |
mv |
| 选择 |
select |
- |
| 投票 |
vote |
- |
| 登录 |
login |
- |
| 注册 |
sign up |
- |
| 同意 |
agree |
- |
| 确认 |
confirm |
- |
| 取消 |
cancel |
- |
| 是 |
yes |
- |
| 否 |
no |
- |
| 发表 |
publish |
- |
| 发送 |
send |
- |
| 评论 |
comment |
| 回复 |
reply |
- |
| 更多 |
more |
- |
| 关闭 |
close |
- |
| 推送 |
push |
- |
| 拉去 |
pull |
- |
| 点击 |
click |
- |
| 设置 |
setting |
set |
修饰、状态
| 中文 |
英文 |
简写 |
| 常态 |
normal |
nor |
| 鼠标悬停 |
hover |
- |
| 激活 |
active |
- |
| 禁用 |
disabled |
dis |
| 警告 |
warning |
- |
| 危险 |
danger |
- |
| 错误 |
error |
- |
| 成功 |
success |
- |
| 失败 |
fail |
- |
| 加载 |
loading |
- |
| 大 |
large |
lg |
| 中 |
middle |
md |
| 小 |
small |
sm |
| 额外的 |
extra |
x |
常用图标
图标直接翻译为其形状名称，避免同一个图标表示不同含义而出现混乱。比如说心形，可以表示喜欢、赞、收藏、爱、等含义，星形可以表示收藏、等级等含义，按照含义翻译会出现一个图标有多重名称的情况，不方便图标库的管理。
对于没有歧义，通用的图标优先使用通用含义进行翻译。比所说放大镜通常用来搜索，此处翻译为search，纸飞机通常用来表示发送的含义，则翻译为send，而非paper-plane
| 中文 |
英文 |
简写 |
| 通讯录 |
address-book |
- |
| 照相机 |
camera |
- |
| 存档 |
archive |
- |
| 银行 |
bank |
- |
| 电池 |
battery |
- |
| 床 |
bed |
- |
| 啤酒 |
beer |
- |
| 铃铛 |
bell |
- |
| 生日 |
birthday |
- |
| 蓝牙 |
bluetooth |
- |
| 炸弹 |
bomb |
- |
| 书、书籍 |
book |
- |
| 书签 |
bookmark |
- |
| 公文包 |
briefcase |
- |
| 故障、程序错误 |
bug |
- |
| 建筑 |
building |
- |
| 扩音器 |
bullhorn |
- |
| 公交车 |
bus |
- |
| 汽车 |
car |
- |
| 火车 |
train |
- |
| 货车 |
truck |
- |
| 飞机 |
plane |
- |
| 地铁 |
subway |
- |
| 自行车 |
bicycle |
- |
| 出租车 |
taxi |
- |
| 摩托车 |
motorcycle |
- |
| 船 |
boat、ship |
- |
| 热气球 |
balloon |
- |
| 日历 |
calendar |
- |
| 照相机 |
camera |
- |
| 购物车 |
cart |
- |
| 包 |
bag |
- |
| 篮子 |
basket |
- |
| 版权 |
copyright |
- |
| 云 |
cloud |
- |
| 雾 |
fog |
- |
| 雨 |
rain |
- |
| 风 |
wind |
- |
| 晴 |
sunny |
- |
| 太阳 |
sun |
- |
| 雪 |
snow |
- |
| 霜 |
frost |
- |
| 雷 |
thunder |
- |
| 对号 |
checkmark |
- |
| 关闭 |
close |
- |
| 警告 |
warning |
warn |
| 齿轮 |
cog |
- |
| 评论 |
comment |
- |
| 信用卡 |
credit-card |
- |
| 裁剪 |
crop |
- |
| 桌面 |
desktop |
- |
| 控制面板 |
dashboard |
- |
| 钻石 |
diamond |
- |
| 编辑 |
edit |
- |
| 删除 |
delete |
del |
| 移动 |
move |
mv |
| 复制 |
copy |
- |
| 粘贴 |
paste |
- |
| 橡皮 |
eraser |
- |
| 上传 |
upload |
- |
| 下载 |
download |
- |
| 分享 |
share |
- |
| 发送 |
send |
- |
| 更多 |
more |
- |
| 菜单 |
menu |
- |
| 举报 |
report |
- |
| 邮件、信封 |
mail |
- |
| 收件箱 |
inbox |
- |
| 邮箱 |
mailbox |
- |
| 眼睛 |
eye |
- |
| 眼镜 |
glasses |
- |
| 交换 |
exchange |
- |
| 外部链接 |
external-link |
- |
| 链接 |
link |
- |
| 信息聚合 |
really simple syndication |
rss |
| 性别 |
gender |
- |
| 男性 |
male |
- |
| 女性 |
female |
- |
| 文件 |
file |
- |
| 视频 |
video |
- |
| 图片 |
image |
img |
| PDF |
- |
pdf |
| 压缩文件 |
zip |
- |
| 音频 |
sound |
- |
| 影片 |
movie |
- |
| 筛选 |
filter |
- |
| 文件夹 |
folder |
- |
| 旗 |
flag |
- |
| 游戏 |
game |
- |
| 礼物 |
gift |
- |
| 群组 |
group |
- |
| 杯子 |
glass |
- |
| 地球 |
globe |
- |
| 头戴式耳机 |
headphone |
- |
| 耳机 |
earphone |
- |
| 心 |
heart |
- |
| 历史 |
history |
- |
| 家、主页 |
home |
- |
| 沙漏 |
hourglass |
- |
| 信息 |
info |
- |
| 钥匙 |
key |
- |
| 锁 |
lock |
- |
| 键盘 |
keyboard |
- |
| 语言 |
language |
- |
| 地图 |
map |
- |
| 路标 |
map-sign |
- |
| 地址 |
address |
- |
| 定位 |
location |
- |
| 定位箭头 |
location-arrow |
- |
| 加 |
plus |
- |
| 减 |
minus |
- |
| 乘 |
multipy |
- |
| 除 |
divide |
- |
| 手机 |
phone |
- |
| 电话 |
telephone |
tel |
| 音乐 |
music |
- |
| 铅笔 |
pencil |
- |
| 钢笔 |
pen |
- |
| 关闭 |
power-off |
- |
| 电源 |
power |
- |
| 打开 |
power-on |
- |
| 打印 |
print |
- |
| 二维码 |
qrcode |
- |
| 问题 |
question |
- |
| 引用 |
quote |
- |
| 随机 |
random |
- |
| 刷新 |
refresh |
- |
| 火箭 |
rocket |
- |
| 搜索 |
search |
- |
| 星星 |
star |
- |
| 半星 |
half-star |
- |
| 票 |
ticket |
- |
| 奖杯 |
trophy |
- |
| 用户 |
user |
- |
参考链接
Bootstrap · The most popular HTML, CSS, and JS framework in the world.
Font Awesome, the iconic font and CSS toolkit
编码规范 by @mdo
css模块化思想（一）————命名是个技术活 - 妙瞳 - 博客园
