下载文档原格式
史上最全！css 命名规范（英文命名）一．文件命名规范[b] 样式文件命名[/b] [quote] 主要的master.css 布局，版面layout.css 专栏columns.css 文字font.css 打印样式print.css 主题themes.css [/quote][b]CSS ID 的命名[/b][quote] 页头：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版权copyrightwrap mainnav subnav footer content header footerlabel title mainbav ( globalnav ) topnav sidebarleftsidebar rightsidebar logo banner menu1contentmenucontainer submenu sidebarIcon注释： note面包屑： breadcrumb （ 即页面所处位置导航提示） 容器： 内容： 搜索： 登陆： 功能区： containercontentsearch Loginshop( 如购物车，收银台 ) 当前的 current[/quote][b] 网站常用中英文对照表 [/b] [quote] 网站导航 Site Map公司简介 Profile or Company Profile or Company 公司设备 Equipment Equipment 公司荣誉 Glories Glories 企业文化 Culture Culture 产品展示 Product Product 资质认证 Quality Certification 企业规模 Scale Scale 营销网络 Sales Network组织机构 organization organization 合作加盟 Join In Cooperation 技术力量 Technology Technology 经理致辞 Manager's oration 发展历程 Development History外 套： 主导航： 子导航：页 脚： 整个页面： 页 眉： 页 脚： 商 标： 标 题： 主导航： 顶导航： 边导航： 左导航： 右导航： 旗 志： 标 语： 菜单内容 1： 菜单容量： 子菜单： 边导航图标：工程案例Engineering Projects 业务范围Business Scope 分支机构Branches 供求信息Supply & Demand 经营理念Operation Principle 产品销售Sales Sales 联系我们Contact Us Contact Us 信息发布Information Information 返回首页Homepage Homepage 产品定购order order 分类浏览Browse By Category 电子商务E-business 公司实力Strength Strength 版权所有Copy Right 友情连结Hot Link 应用领域Application Fields 人力资源Human Resource Hr 领导致辞Leader's oration 企业资质Enterprise Qualification 行业新闻Trade News 行业动态Trends 客户留言Customer Message 客户服务Customer Service 新闻动态News & Trends 公司名称Company Name 销售热线Sales Hot-Line 联系人Contact Person 您的要求Your Requirements 建设中In Construction 证书Certificate Certificate 地址ADD Add 邮编Postal Code Zipcode 电话TEL Tel 传真FAX Fax 产品名称Product Name 产品说明Description Description 价格Price 品牌Brand 规格Specification 尺寸Size生产厂家Manufacuturer Manufacturer 型号Model产品标号Item No. 技术指标Technique Data产品描述Description产地Production Place销售信息Sales Information用途Application论坛Forum在线订购On-line order招商Enterprise-establishing招标Bid Inviting综述General业绩Achievements招聘Join Us求贤纳士Join Us大事Great Event动态Trends服务Service投资Investment行业Industry规划Programming环境Environment发送Delivery提交Submit重写Reset登录Enter注册Login中国企业网技术支持Powered By 社区Community业务介绍Business Introduction在线调查Online Inquiry Inquiry下载中心Download会员登陆Member Entrance意见反馈Feedback常见问题FAQ中心概况General Profile教育培训Education & Training 游乐园Amusement Park 在线交流Online Communication 专题报道Special Report[/quote]常用类的命名应尽量以常见英文单词为准，做到通俗易懂，并在适当的地方加以注释。
left 左边；居左center 中间；居中right 右边；居右top 顶部bottom 底部height 高度foot 脚，足；低部width 宽度font 字体colour 颜色weight 重量；粗细size 尺寸；大小title 标题list 列表menu 菜单column（报刊）专栏；栏目product 产品text 课文; 正文, 本文;company 公司inline内嵌banner (写有标语的）横幅；广告news 新闻；消息logo 标志；商标contact 联系备注：Contact us 联系我们more 更多（的）flash 闪亮（光）；动画picture/pic 图片（画）guestbook 留言板date 日期address /Add 地址border 边沿（界）；边框box 盒子；框框main 主要的；页面主体letter 信；字母；文字image/img 图像(片) link 链接备注：freindlink / hot link友情链接background/bg 背景header 头部；页眉footer 尾部；页脚body 内容区style 风格;式样family 家, 家庭about 关于备注：About us关于我们space 间隔;距离dot 点，圆点;打点于…. disc 圆盘; 磁盘, 光盘circle 圆(圈)square 正方形; 方形(块)overflow 溢流;溢出hidden 隐藏的;不明显的relative 相对的; absolute 绝对的clear 扫除, 清除float 漂浮，浮动display 展示; 显示scroll 滚动dotted 点线; 点dashed 虚线.solid 固体的; 实心的;实线double 双的；双线.block 大块(木料、石料); 块position 方位, 位置normal 正常的;数值attachment 附件；连接物big 大的small 小的line 线条, 线, 绳fixed 固定的English 英语（文）decoration 修饰vertical 垂直的, 竖的align 对齐; 使成一线margin 页边空白；外边距padding 内边距justify 两端对齐none 没有repeat 重做;重复underline 下划线inside 里面, 内部outside 外面；外部page 页（面）copyright 版权input 输入(框）Vip=very important person 会员/很重要的人物备注：important 重要的person 人物submit 呈送，提交both 两个都indent 缩进排。
常用的CSS标签标记属性翻译注释1、字体属性(type)font-family(使用什么字体)font-style(字体的样式，是否斜体)：normal/italic/obliquefont-variant(字体大小写)：normal/small-capsfont-weight(字体的粗细)：normal/bold/bolder/lithterfont-size(字体的大小)：absolute-size/relative-size/length/percentage2、颜色和背景属性(backgroud)color(定义前景色，例如：p{color:red})background-color(定义背景色)background-image(定义背景图片)background-repeat(背景图案重复方式)：repeat-x/repeat-y/no-repeatbackground-attachment(设置滚动)：scroll(滚动)/fixe(固定的)background-position(背景图案的初始位置)：percentage/length/top/left/right/bottom3、文本属性：(block)定义间距：word-spacing(单词之间的距离)letter-spacing(字母之间的距离)text-decoration(定义文字的装饰)：nore/underline/overline/line-through/blinkvertical-align(元素在垂直方向的位置)：baseline(基线)/sub/super/top/text-top/middle/bottom/text-bottomtext-transform(使文本转换为其它方式)：capitalize(大写)/uppercase(首字母大写)/lowercase(小写)/nonetext-align(文字的对齐)：left/right/center/justifytext-indent(文本的首行缩进)length/percentageline-height(文本的行高):normal/numbet/lenggth/percentage(百分比)定义超链接：a：link {color:green;text-decoration:nore}(未访问过的状态)a：visited {color:ren;text-decoration:underline;16pt}(访问过的状态)a:hover {color:blue;text-decoration:underline;16pt}(鼠标激活的状态)4、块属性(block)边距属性：margin-top(设置顶边距)margin-right(设置右边距)margin-bottom(设置底边距)margin-left(设置左边距)填充距属性：padding-top设置顶端真充距)padding-right设置顶端真充距)padding-bottom设置顶端真充距)padding-left设置顶端真充距)5、边框属性(border)border-top-width(顶端边框宽度)border-right-width(右端边框宽度)border-bottom-width(底端边框宽度)border-left-width(d左边框宽度)border-width(一次定义边框宽度)border-color(设置边框颜色)border-style(设置边框样式)border-top(一次定义顶端各种属性)border-right(一次定义右端各种属性)border-bottom(一次定义底端各种属性)border-left(一次定义左端各种属性)图文混排：width(定义宽度属性)height(定义高度属性)float(文字环绕在一个元素的四周)clear(定义某一边是否有环绕)6、项目符号和编号(list)display(定义是否显示)white-space(怎样处理空白部分)：normal/pre/nowraplist-style-type(在列表前加项目符号)disc(圆点)/circle(圈)/square（方形）/decimal（阿拉伯数字）/lower-roman(小写罗马数字)/upper-roman(大写罗马数字)/lower-alpha(小写英文字母)/upper-alpha(大写英文字母)/norelist-style-tyle(在列表前加图案):<url>/nonelist-style-position(决定列表项中第二行的起邕位置)list-style(一次性定义所有属性)7、定位（positioning）即层属性Type：设定对象的定位方式。
html css单词汇总1. HTML标签：HTML标签是构成网页的基本元素，用于定义网页的结构和内容。
常见的HTML标签包括：<html>、<head>、<title>、<body>、<h1>、<p>、<a>、<img>等。
2. CSS选择器：CSS选择器用于选择要应用样式的HTML元素。
常见的CSS 选择器包括：元素选择器、类选择器、ID选择器、属性选择器等。
3. 颜色值：颜色值用于指定网页中元素的背景色、字体色等。
常见的颜色值包括：十六进制颜色值（如#FF0000表示红色）、RGB颜色值（如rgb(255,0,0)表示红色）、RGBA颜色值（如rgba(255,0,0,0.5)表示半透明的红色）等。
4. 盒模型：盒模型是CSS布局的基础，每个HTML元素可以看作是一个盒子，由内容、内边距、边框和外边距组成。
通过盒模型，可以对元素进行定位、排列和对齐等操作。
5. 布局方式：CSS提供了多种布局方式，包括：定位（absolute、relative、fixed、sticky）、浮动（float）、弹性盒子（flexbox）、网格（grid）等。
这些布局方式可以实现复杂的页面布局。
6. 字体样式：字体样式用于指定网页中元素的字体、字号、加粗、斜体等。
常见的字体样式包括：font-family（字体类型）、font-size（字号）、font-weight （加粗）、font-style（斜体）等。
7. 动画效果：CSS提供了动画效果，可以实现元素的渐变、旋转、缩放等动态效果。
通过@keyframes规则，可以创建动画效果，并使用animation属性将其应用到元素上。
8. 媒体查询：媒体查询是响应式设计的关键技术，通过媒体查询可以根据设备的特性（如宽度、高度、分辨率等）应用不同的样式，实现自适应布局。
9. 响应式设计：响应式设计是一种设计方法论，旨在创建能够适应不同设备和屏幕尺寸的网页。
sticky粘性的;热湿的，闷热的;极不愉快的;不动的;radius桡骨;半径范围;半径（距离）;用半径度量的圆形面积;slice切成片;切下;划分stretch伸展;延伸;持续;包括;opacity不透明性;费解;难懂;模糊;variant变体，（字音的）转讹;[生]变种，变异体;变形，变量，转化;[统]变式; weight重量，体重;重担，重任;重要;[统]权，加重值，权重;ultra过激的，极端的;condensed（使）变稠或变浓，浓缩;（使）凝结;简说，摘要，简述;extra额外的，补充的，附加的;特大的，特别的;semi半独立式住宅;半挂车;expanded膨胀的;扩大[张]的;延伸的;展[张]开的;adjust适应，调整，校正;white白色的，纯洁的;无色的，透明的;白衣的;白种人的;wrap包;缠绕;用…包裹（或包扎、覆盖等）;掩护;justify证明…有理;为…辩护;对…作出解释;inter埋，葬;ideograph象形（表意）文字;cluster群;丛;簇，串;[语言]辅音群;distribute分配，散布;散发，分发;把…分类;[电]配电;through透过;经由;通过，穿过;凭借;skip跳;跳绳;悄悄溜走;快速转移;edges边(edge的名词复数);优势;（悬崖、峭壁的）边缘;锋利;under在…下面，在表面之下;在…的假定表面或掩饰下;embed把…嵌入;栽种;深留（记忆中）;override覆盖;推翻，无视;践踏;优先于;horizontal水平的，卧式的;地平线的;[植]（枝条）平层的;同阶层的; vertical垂直的，竖立的;[解]头顶的;顶点的;[植]纵长的，直上的;decimal十进位的，小数的;阿拉伯数字;alpha希腊字母的第一个字母;英文字母;layout布局，安排，设计;布置图，规划图;fixed固定的，不变的;不易挥发的;collapse崩溃;倒塌;折叠;（尤指工作劳累后）坐下;separate分开;（使）分离;区分;隔开;groove沟，槽;[俚语]常规，老套：确定的规范;[俚语]理想状况;ridge背脊，峰，隆起线;山脊，山脉，海脊;高压脊;皱摺，田埂;inset插入物，插进;outset开始，开端;appearance外貌，外观;出现，露面;[哲]现象;ellipsis省略;inactive闲置的;不活动的，不活跃的;懒散的，怠惰的;[化]钝性的;pointer教鞭;建议;线索;（测量仪器上的）指针;balance平衡;天平;平衡力;（酿酒配料的）均衡;always常常;总是，老是;永远，始终;不断地;avoid避开，避免，预防;[法]使无效，撤销，废止;orient标定方向;使…向东方;以…为参照;使熟悉或适应;pack包裹;一群;（纸牌的）一副;一组;flex弯曲（关节）;收缩（肌肉）;显示力量;ordinal序数;比较;direction方向;趋势;方面;用法说明;grow种植;增加;扩大;扩展;shrink收缩，皱缩;（使）缩水;退缩，畏缩;basis基础;主要成分;基准，基本原则;flow流;垂;流出;（谈话、文体等）流畅;items物料项目;条(item的名词复数);一项;一则;一件商品（或物品）; matrix基质;<数>矩阵;模型;property特性，属性;财产，地产;[戏]道具;所有权;duration持续，持续的时间，期间;（时间的）持续，持久，连续;音长，音延; timing定时;时机掌握;配光;记时;ease安逸;容易;轻松，舒适;不拘束，自在;paused暂停;停顿;暂停放音;暂停放像;running跑步;运转;流出;forwards向前方，继续向前;backwards向后的;倒行的;返回的;落后的;media媒体;介质;[解剖学]血管中层;[语音学]浊塞音;[医]培养基;device装置，设备;方法;策略;手段;orientation方向，定位，取向，排列方向;任职培训;portrait肖像，肖像画;模型，标本;半身雕塑像;人物描写;landscape风景;风景画;乡村风景画;地形;aspect方面;面貌;方位，方向;形势;ratio比例;比，比率;系数;monochrome单色画，单色照片，黑白照片;resolution分辨率;解决;决心;坚决;scan扫描;细看;细查;（雷达）对…进行扫描;progressive进步的;不断前进的;进行的;interlace使交错，使交织;grid格子，非实质的;地图上的坐标方格;dark黑暗的;乌黑的;忧郁的;神秘的;light光;发光体;电灯;点火器;arrow矢，箭;箭状物;箭头记号;[天]天箭座;track小路，小道;痕迹，踪迹;轨道，音轨;方针，路线;stroke中风;一击;击球;划水动作;reflect反射（光、热、声或影像）;考虑;above（表示程度）超过;（表示等级）在…之上;（表示位置）在…正上方; highlight强光部份;最重要的事情;最精彩的部分;drag拖拽;吃力地往前拉;拖地而行;letter：信;证书，许可证;字母，文字;字面意义;placeholder：占位符;important：重要的;权威的;有势力的;有地位的;comment：评论;注释;意见;说明;import：输入;进口，进口商品;重要性;意义;media：媒体;介质;[解剖学]血管中层;[语音学]浊塞音;[医]培养基; font：字体keyframes：关键帧;supports：支撑;支持(support的第三人称单数);帮助;维持; operator：操作员;经营者;运算符;电话接线员;Gradians：梯度Radians：弧度turns：圈frequency：频繁性;[数][物]频率，次数;频率分布;fraction：[数]分数;一小部分，些微;不相连的一块，片段;[化]分馏; resolution：分辨率;解决;决心;坚决;transparent：透明的;清澈的;易识破的;显而易见的;inherit：继承;initial：最初的;开始的;首字母的;identifier：识别符;检验人，标识符;鉴别器;编号;calc：计算;toggle：棒形纽扣;套索扣;转换键;切换键;counter：计数器;柜台;对立面;（某些棋盘游戏的）筹码;corner：拐角;角落，角;困境;[商]囤积;radial：径向的;辐射状的;放射式的;星形的;integer：整数;percentage：百分比，百分率;比例，部分;[数]百分法;[商]手续费;。
bem命名方式
"BEM" 是一种CSS命名方法，它代表"块"（Block）、"元素"（Element）和"修饰符"（Modifier）。
在BEM命名方式中，每个CSS类的命名都应该根据其在页面上的作用来命名，而不是根据其样式。
下面是BEM命名方式的一些示例：
1. 块（Block）：代表一个独立的组件或模块，在命名时使用简短的描述性词汇，使用连字符分隔不同的单词。
例如：.header、.sidebar、.button。
2. 元素（Element）：代表块中的子元素，使用两个连字符来分隔块和元素的名称。
例如：.header__logo、.sidebar__menu、.button__text。
3. 修饰符（Modifier）：代表块或元素的不同状态或变体，使用两个下划线和修饰符名称来表示。
例如：.buttonprimary、.sidebar__menucollapsed。
使用BEM命名方式可以使CSS类的名称更具有可读性和可维护性，而且可以减少样式之间的冲突和歧义。
CSS 背景属性（Background）Background在一个声明中设置所有的背景属性。
background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。
background-color设置元素的背景颜色。
background-image设置元素的背景图像。
background-position设置背景图像的开始位置。
background-repea设置是否及如何重复背景图像。
CSS 边框属性（Border 和Outline）border在一个声明中设置所有的边框属性。
border-bottom在一个声明中设置所有的下边框属性。
border-bottom-color设置下边框的颜色。
border-bottom-style设置下边框的样式。
border-bottom-width设置下边框的宽度。
border-color设置四条边框的颜色。
border-left在一个声明中设置所有的左边框属性。
border-left-color设置左边框的颜色。
border-left-style设置左边框的样式。
border-left-width设置左边框的宽度。
border-right在一个声明中设置所有的右边框属性。
border-right-color设置右边框的颜色。
border-right-style设置右边框的样式。
border-right-width设置右边框的宽度。
border-style设置四条边框的样式。
border-top在一个声明中设置所有的上边框属性。
border-top-color设置上边框的颜色。
border-top-style设置上边框的样式。
border-top-width设置上边框的宽度。
border-width设置四条边框的宽度。
outline在一个声明中设置所有的轮廓属性。
outline-color设置轮廓的颜色。
outline-style设置轮廓的样式。
CSS常用英语词汇大全Aabsolute ['æbsəlu:t]绝对的，完全的active ['æktiv] 活动的，激活的，<a>标记的一个伪类align [ə'lain] 对齐alpha ['ælfə] 透明度，半透明anchor['æŋkə]锚记<a>标记是这个单词的缩写arrow ['ærəu]箭头auto['ɔ:təu] 自动的Bbackground ['bækgraund] 背景banner['bænə]网幅广告, 旗帜广告, 横幅广告(网络广告的主要形式, 一般使用GIF格式的图像文件, 可以使用静态图形, 也可用多帧图像拼接为动画图像) black [blæk]黑色blink：[bliŋk]闪亮,闪烁block[blɔk]块blue[blu:]蓝色body['bɔdi] 主体，一个HTML标记bold [bəuld]加粗border['bɔ:də]边框、框线边框both [bəuθ]两者(都);两个(都);是clear属性的一个属性值bottom ['bɔtəm] 底;底部，是一个CSS属性box[bɔks] 箱;盒;匣br 换行标记bug [bʌg] 程序设计上的错误，漏洞等building ['bildiŋ]建筑button ['bʌtn]按钮Ccell[sel]表格中的单元格center ['sentə]居中centimeter ['senti,mi:tə] 厘米child [tʃaild] 孩子circle ['sə:kl] 圆圈class [klɑ:s]类别clear [kliə] 清除cm 厘米color ['kʌlə] 颜色connected [kə'nektid] 连结的contact ['kɔntækt] 联系content [kən'tent] 内容crosshair 十字准线css 层叠样式表cursor ['kə:sə] 鼠标指针Ddashed [dæʃt] 虚线CSS边框常用的一种decimal ['desiməl] 十进制decoration [,dekə'reiʃən] 装饰default [di'fɔ:lt] 默认的definition [,defi'niʃən] 定义design [di'zain] 设计display [di'splei ] 显示，CSS的一个属性division [di'viʒən] 分区，div就是这个单词的缩写document ['dɔkjumənt] 文件文档dotted ['dɔtid] 点线double ['dʌbl] 双线Eelement ['elimənt] 元素Ffather ['fɑ:ðə]父亲,父filter ['filtə] 过滤层；滤器first [fə:st] 第一个fixed [fikst] 固定的，不变的float [fləut] 浮动font [fɔnt] 字体for 在循环语句中的一个保留字four 4个Ggif 一种图像格式gray [grei]灰色green [gri:n]绿色Hhack [hæk]常用于CSS中的一些招数，或者类似于偏方的技巧hand [hænd] 手head [hed] 头部height [hait] 高度help [help] 帮助here [hiə] 这里hidden ['hidn] 被隐藏home [həum] 首页horizontal [,hɔri'zɔntl] 水平的hover ['hʌvə]鼠标指针经过或称为悬浮状态Iimage ['imidʒ]图像important [im'pɔ:tənt]重要的indent [in'dent]缩进index ['indeks]索引inline 行内inner 内部的italic [i'tælik]意大利体，斜体Jjpg 一种图像格式justify ['dʒʌstifai]两端对齐Llanguage ['læŋgwidʒ]语言last [lɑ:st]最后一个left [left]左边length [leŋθ]长度level ['levl]级别，例如block-level就是块级line [lain]线link [liŋk]链接list [list]列表lowercase ['ləuə,keis]小写Mmargin ['mɑ:dʒin]外边距max 最大的medium ['mi:diəm]中间menu ['menju:]菜单middle ['midl]中间millimeter ['mili,mi:tə]毫米min 最小的model ['mɔdl]模型move [mu:v]移动Nnavigation [,nævi'geiʃən]导航new [nju:]新的none [nʌn]无，没有normal ['nɔ:məl]标准Oobject ['ɔbdʒikt]对象oblique [əb'li:k]一种斜体one 一个only ['əunli]仅仅open ['əupən]打开optional ['ɔpʃənəl]可选的orange ['ɔ:rindʒ]橙色outer ['autə]外面的overflow [,əuvə'fləu]溢出Ppadding ['pædiŋ]内边距point [pɔint] 点pointer ['pɔintə] 指针，指示器position [pə'ziʃən] 定位，位置progress ['prəugres] 进度public ['pʌblik] 公开的purple ['pə:pl] 紫色Rred [red] 红色relative ['relətiv] 相对的repeat [ri'pi:t] 重复，平铺replacement [ri'pleismənt] 替换resize 重新设置大小right [rait] 右边row [rəu] 行Sscroll [skrəul] 滚动shadow['ʃædəu] 阴影silver ['silvə] 银色size [saiz] 尺寸solid ['sɔlid] 固体，实线solution [sə'lu:ʃən] 方案son [sʌn] 儿子span [spæn] 一个HTML标记special ['speʃəl] 特殊的square [skwɛə] 方块static ['stætik] 静态的strong [strɔŋ]强壮，加粗的style [stail] 样式Ttable ['teibl] 表格td 单元格的HTML标记text [tekst] 文本thick [θik]粗的thin [θin]细的three [θi:] 三个through [θru:]穿过title ['taitl] 标题top [tɔp] 顶部tr 表格中“行”的HTML标记transitional [træn'ziʃənəl] 过渡的two 两个type [taip] 类型Uunderline [,ʌndə'lain] 下划线upper ['ʌpə] 上面的uppercase ['ʌpə,keis] 大写url 网址vvertical ['və:tikəl] 竖直的visited ['vizit] 访问过的wwhile [hwail] 白色的width [widθ]宽度Yyellow ['jeləu] 黄色。
