Web前端——CSS的命名规范和范例

简介:

      CSS的命名规范

1   意义

  规范的命名有助有提升团队开发效率

   规范的命名有助有后期产品的维护

   规范的命名有助有后期的二次开发

2   范例

2.1   页面结构

   container/wrap   容器

   header   页头

   main   页面主体

   sidebar   侧栏

   center   中间内容

   wrapper   整体宽度

   content   内容

   footer   页尾

   column   栏目

2.2   导航

   nav   导航

   subnav   子导航

   sidebar   边导航

   rightsidebar   右导航

   menu   菜单

   title   标题

   mainnav/globalnav   主导航

   topnav   顶导航

   leftsidebar   左导航

   sidebarIcon   边导航图标

   submenu   子菜单

2.3   功能

   logo   标志

   loginbar   登录条

   products   产品

   products_review   产品评论

   banner   广告/标语

   login   登陆

   regsiter   注册

   products_prices   产品价格

   editor_review   编辑评论

   news_release   最新产品

   summary   摘要

   publisher   生产商

   faqs   常见问题

   blog   博客

   search   搜索

   search_output   搜索输出

   joinus   加入我们

   btn   按钮

   tab   标签页

   mag/message   提示信息

   tips   小技巧

   pay   充值

   promotion   推广

   ranking   排行

   equipment   公式设备

   culture   企业文化

   sales_network   营销网络

   technology   技术力量

   enterprise_qualification   企业资质

   screenshot   缩略图

   keyword   关键词

   forum   论坛

   search_input   搜索输入框

   search_results   搜索结果

   status   状态

    scroll   滚动

   list   文章列表

   current   当前的

   skin   皮肤

   activities   活动

   announcement   公告

   company_profile   公式简介

   glories   公司荣耀

   scale   企业规模

   organization   组织机构

   branches   分支机构

   strength_strength   公式实力

   operation_principle   经营理念

   development_history   发展历程

   browse_by_category   发展要求

   human_resource_hr   人力资源

   customer_message   客户要求

   your_requirements   您的要求

   enterprise_establishing   招商

   online_communicarion   在线交流

   joinIn_cooperation   合作加盟

   business_scope   业务范围

   contact_us   联系我们

   homepage   返回首页

   e_business   电子商务

   manager_oration   经理致辞

   engineering_projects   工程案件

   application_fields   应用领域

   leader_oration   领导致辞

   customer_service   客户服务

   sales_information   销售信息

   education_training   教育培训

   quality_certification   质量认证

   products_description   产品描述

   sales_sales   产品销售

   information   信息发布

   order   产品定购

   copy_right   版权所有

   hot_link   友情连结

   trends   行业动态

   news_trends   新闻动态

   sales_hotline   销售热线

   in_construction   建设中

   add   地址

   fax   传真

   description   产品说明

   brand   品牌

   size   尺寸

   model   型号

   technique_data   技术指标

   production_place   产地

   forum   论坛

   bidInviting   招标

   achievements   业绩

   trends   动态

   investment   投资

   programming   规划

   trade_news   行业新闻

   postal_code_zipcode   邮编

   company_name   公司名称

   contact_person   联系人

   certificate   证书

   tel   电话

   product_name   产品名称

   price   价格

   speciflcation   规格

   manufacuturer   生产厂家

   item_no   产品标号

   description   产品描述

   application   用途

   on_line_order   在线订购

   general   综述

   great_event   大事

   service   服务

   industry   行业

   environment   环境

   delivery   发送

   reset   重写

   business   业务

   download   下载中心

   faq   常见问题

   amusement_park  游乐园

   icon   图标

   guild   指南

   hot   热点

   dowmload   下载

   label/branding   商标

   shop   购物车

   siteinfo_credits   信誉

   siteinfo_legal   法律声明

   friendlink   友情链接

   submit   提交

   community   社区

   online_inquiry   在线调查

   feedback   意见反馈

   general_profile   中心概况

   special_report   专题报道

   note   注释

   service   服务

   news   新闻

   vote   投票

   breadcrumb/loc   当前位置

   tag   标签

   siteinfo   网站信息

   partner   合作伙伴

   copyright   版权


本文转自 拉考的考拉 51CTO博客,原文链接:http://blog.51cto.com/lakaodekaola/1977563


相关文章
|
10天前
|
编解码 前端开发 JavaScript
构建高效响应式Web界面:现代前端框架的比较
【4月更文挑战第9天】在移动设备和多样屏幕尺寸盛行的时代,构建能够适应不同视口的响应式Web界面变得至关重要。本文深入探讨了几种流行的前端框架——Bootstrap、Foundation和Tailwind CSS,分析它们在创建响应式设计中的优势与局限。通过对比这些框架的栅格系统、组件库和定制化能力,开发者可以更好地理解如何选择合适的工具来优化前端开发流程,并最终实现高性能、跨平台兼容的用户界面。
|
11天前
|
前端开发 JavaScript 关系型数据库
从前端到后端:构建现代化Web应用的技术探索
在当今互联网时代,Web应用的开发已成为了各行各业不可或缺的一部分。从前端到后端,这篇文章将带你深入探索如何构建现代化的Web应用。我们将介绍多种技术,包括前端开发、后端开发以及各种编程语言(如Java、Python、C、PHP、Go)和数据库,帮助你了解如何利用这些技术构建出高效、安全和可扩展的Web应用。
|
12天前
|
编解码 前端开发 JavaScript
Web 前端开发中的最佳实践
本文将介绍 Web 前端开发中的最佳实践,包括代码组织、性能优化、响应式设计和用户体验等方面。通过遵循这些实践,开发人员可以提高开发效率,优化用户体验,并减少潜在的问题和错误。
|
15天前
|
缓存 前端开发
前端代码整洁与规范之CSS篇
【4月更文挑战第2天】 前端代码整洁与规范之CSS篇
35 4
|
4天前
|
移动开发 前端开发 JavaScript
CSS选择器 前端开发入门笔记(十)
CSS选择器 前端开发入门笔记(十)
16 1
|
4天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
14 1
|
4天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
|
5天前
|
前端开发 JavaScript vr&ar
前端新技术探索:WebAssembly、Web Components与WebVR/AR
【4月更文挑战第12天】WebAssembly、Web Components和WebVR/AR正重塑Web应用的未来。WebAssembly允许C/C++等语言在Web上高效运行,提供接近原生的性能,如游戏引擎。Web Components通过Custom Elements和Shadow DOM实现可复用的自定义UI组件,提升模块化开发。WebVR/AR(现WebXR)则让VR/AR体验无需额外应用,直接在浏览器中实现。掌握这些技术对前端开发者至关重要。
13 3
|
8天前
|
前端开发 JavaScript 搜索推荐
CSS框架是前端开发中不可或缺的工具
【4月更文挑战第12天】CSS框架是前端开发中不可或缺的工具
17 2
|
15天前
|
监控 JavaScript 前端开发
《理解 WebSocket:Java Web 开发的实时通信技术》
【4月更文挑战第4天】WebSocket是Java Web实时通信的关键技术,提供双向持久连接,实现低延迟、高效率的实时交互。适用于聊天应用、在线游戏、数据监控和即时通知。开发涉及服务器端实现、客户端连接及数据协议定义,注意安全、错误处理、性能和兼容性。随着实时应用需求增加,WebSocket在Java Web开发中的地位将更加重要。