`
xiaoyaoniu
  • 浏览: 189135 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

div+css命名规范 嫁接android xml命名

 
阅读更多
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 

 

分享到:
评论

相关推荐

    div+css例子 div+css例子

    div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子div+css例子...

    div+css百分比表格+DIV+CSS+JS静态分页程序+DIV+CSS像素表格

    div+css百分比表格+DIV+CSS+JS静态分页程序+DIV+CSS像素表格 百分比表格(用DIV+CSS)以百分比显示,可以根据窗口的大小自动调节所显示的大小! DIV+CSS+JS静态分页程序可兼容主流浏览器(IE、FF、Opera) DIV+CSS表格...

    DIV+CSS规范命名大全集合

    ### DIV+CSS规范命名大全集合 #### CSS规范命名与实践指南 在网页设计与开发过程中,DIV+CSS的布局方式已经成为了业界的标准做法之一。合理的命名规则不仅能够提高代码的可读性和可维护性,还能有效提升团队协作...

    经典DIV+CSS模板 经典DIV+CSS模板

    描述中的关键词如"div+css"、"web标准"、"div+css布局"、"div+css实例"、"div+css模板"揭示了这些模板遵循Web开发的最佳实践,旨在实现结构与表现的分离,提高网页的可维护性和可访问性。Web标准通常指的是W3C制定的...

    div+css命名规范

    ### DIV+CSS命名规范 #### 一、概述 在网页设计与开发过程中,合理的命名规范对于提高代码可读性、可维护性和团队协作效率至关重要。本文档将详细阐述一套适用于初学者的`div+css`命名规则,帮助开发者建立起良好...

    Table转div+css工具

    Table2CSS3.0.0这个工具的出现,使得开发者能够快速地将旧有的Table结构转换为Div+CSS结构,减少了手动重构的工作量。使用此工具,开发者可以: 1. **保持原有数据结构不变**:工具会保留表格中的数据顺序和关系,...

    简单设计DIV+CSS模板

    《深入理解:基于Div+CSS的网页设计与布局》 Div+CSS是现代网页设计中的核心技术,它在构建Web标准的网页布局中扮演着至关重要的角色。本篇将围绕"简单设计Div+CSS模板"这一主题,深入探讨Div+CSS的基础概念、网页...

    DIV+CSS网页制作对搜索引擎优化的优势分析整理.pdf

    DIV+CSS网页制作对搜索引擎优化的优势分析整理 DIV+CSS网页制作技术的优势在于其符合W3C国际标准,能够将表现与内容分离,提高搜索引擎对网页的索引效率,提高页面浏览速度,易于维护和改版。同时,DIV+CSS网页...

    SEO优化中的DIV+CSS命名规则

    SEO优化中的DIV+CSS命名规则,能减少DIV css,增加加载速度,更加有利于搜索的收录

    html+div+css+js学习.zip

    html+div+css+js学习html+div+css+js学习html+div+css+js学习 html+div+css+js学习html+div+css+js学习html+div+css+js学习 html+div+css+js学习html+div+css+js学习html+div+css+js学习 html+div+css+js学习...

    table布局网页转换为div+CSS布局的转换软件

    `div+CSS`布局则通过分离结构和样式,提高了代码的可读性和可维护性,同时也为创建灵活的、响应式的网页提供了可能。 `table`到`div+CSS`的转换软件就是针对这种情况应运而生的工具。这种软件能够自动将基于`table`...

    div+CSS购物网站模板

    在这个专题中,我们将深入探讨Div+CSS在购物网站模板中的应用,以及它对于网页设计的重要性。 首先,让我们了解什么是Div和CSS。Div(Division)是HTML中的一个布局容器,它允许我们将页面划分为多个独立的区域,...

    div+css布局大全

    下面,我们将深入探讨div+css布局的相关知识点。 1. **Div元素**:HTML中的`<div>`(division)元素是一个通用容器,用于组合HTML元素,为页面提供结构。通过设置`<div>`的类或ID属性,我们可以对多个元素进行分组...

    div+css手册

    《div+css手册》是一本深入探讨网页布局技术的重要参考资料,尤其对于网页设计者和前端开发者来说,它具有极高的学习价值。这个手册的核心聚焦在HTML中的`div`元素和CSS(层叠样式表)的结合使用上,旨在帮助读者...

    两天驾驭DIV+CSS.pdf

    基础篇 1.1 必须知道的基础知识 知识一 DIV+CSS的叫法是不准确的 标准叫法是xHTML+CSS 知识二两大误区 误区一用了Table就不标准。误区二DIV标签越多越好 Table是为了存储数据DIV是为了架设...

    DIV+CSS简单登录界面模板

    在网页设计领域,`DIV+CSS`是一种广泛使用的布局技术,它通过定义不同的`Div`(Division,分块)元素并应用相应的`CSS`(Cascading Style Sheets,层叠样式表)样式来构建页面结构和外观。标题提到的“DIV+CSS简单...

    DIV+CSS网站布局从入门到精通源代码

    DIV+CSS网站布局从入门到精通 源代码 朱印宏 邓艳超 编著 北京希望电子出版社 2011年1月 本教程介绍了商业类型的网页设计,以及目前流行的DIV+CSS标准布局方法和实战技法。通过对十个经典案例进行分析,分别从不同...

    整站模板DIV+CSS 源码DIV+CSS 

    【描述】"DIV+CSS 源码"进一步强调了这个主题,意味着我们将深入到实际的代码层面,了解如何通过Div元素配合CSS实现网页的布局、样式控制以及功能实现。Div常用于定义网页上的不同区域,而CSS则用于定义这些区域的...

    div+css布局制作箭头步骤流程样式 - div+css教程

    在网页设计领域,`div+css`是一种常用的技术,用于实现页面布局和样式控制。`div`元素作为容器,能够包裹其他HTML元素,而CSS(层叠样式表)则负责定义这些元素的外观和位置。在本教程中,我们将深入探讨如何使用`...

Global site tag (gtag.js) - Google Analytics