HTML命名规则
html标记的书写规则
html标记的书写规则HTML（Hypertext Markup Language）是用于创建网页结构和内容的标记语言。
以下是HTML标记的书写规则：1. 标签使用小写字母：HTML标签应使用小写字母进行书写。
HTML是不区分大小写的，但为了代码的统一性和可读性，建议使用小写字母。
2. 使用封闭标签：大部分HTML标记都是成对出现的，即开始标签和结束标签。
开始标签用于表示元素的开头，而结束标签用于表示元素的结尾。
开始标签和结束标签之间包含的内容是元素的内容。
3. 属性使用引号：HTML标记可以包含属性，属性用于提供元素的附加信息。
属性的值应该使用引号包裹，常见的引号有单引号（'）和双引号（"）。
使用引号可以确保属性值正确地被解析，并提高代码的可读性。
4. 标签嵌套正确：HTML标记可以相互嵌套，但必须确保正确的嵌套顺序和层次结构。
嵌套深度应适度，过多的嵌套会使代码难以维护和理解。
5. 使用合适的标记：根据元素的语义和功能，选择合适的HTML标记。
HTML 提供了丰富的标记元素，如标题、段落、列表、链接等，使用适当的标记可以增强页面的可读性和可访问性。
6. 注释代码：在HTML代码中添加注释可以增加代码的可读性和复用性。
注释可以解释代码的用途、目的或特殊注意事项。
注释代码在浏览器中不会被解析和显示。
7. 避免使用过时的标记：HTML标记在不同的HTML版本中会有差异，一些标记已经过时或不推荐使用。
为了保持与最新的HTML标准兼容，尽量避免使用过时的标记。
综上所述，正确书写HTML标记是开发网页的基础。
遵循这些书写规则将帮助我们编写干净、可读和高效的HTML代码，提升网页质量和用户体验。
HTML编码规范
HTML编码规范1. 前⾔HTML作为描述⽹页结构的超⽂本标记语⾔，在任何项⽬⼀直有着⼴泛的应⽤。
本⽂档的⽬标是使HTML代码风格保持⼀致，容易被理解和被维护。
2 .代码风格⽰例：<ul><li>first</li><li>second</li></ul>解释：过长的代码不容易阅读与维护。
但是考虑到 HTML 的特殊性，不做硬性要求.⽰例：<!-- good --><div class="sidebar"></div><!-- bad --><div class="left"></div>解释：同⼀个页⾯中，不同的元素包含相同的 id，不符合 id 的属性含义。
并且使⽤ document.getElementById 时可能导致难以追查的问题。
⽰例：<!-- good --><div id="nav"></div><!-- bad --><div id="navigation"></div><!-- good --><p class="comment"></p><!-- bad --><p class="com"></p><!-- good --><span class="author"></span><!-- bad --><span class="red"></span>解释：不允许 class 只⽤于让 JavaScript 选择某些元素，class 应该具有明确的语义和样式。
phpcms 生产html名字规则
一、概述phpcms是一款常用的开源内容管理系统，它具有灵活的扩展性和丰富的功能，广泛应用于各种全球信息站的建设和维护中。
在phpcms 中，生成静态html页面是常见的操作，而html页面的文件名规则对全球信息站的SEO和用户体验都有重要的影响。
合理的html文件名规则是phpcms全球信息站建设中不可忽视的关键因素之一。
二、html文件名的作用1. 提高全球信息站的SEO效果2. 方便用户记忆和访问3. 优化全球信息站的性能和速度三、phpcms生成html文件名的规则1. 根据页面的属性和内容2. 根据全球信息站的目录结构和后台配置3. 在命名上遵循一定的规范和约定四、常见的html文件名命名规范1. 使用页面的关键词2. 采用短小精悍的方式3. 避免使用特殊字符和符号4. 采用有意义的英文单词或短语5. 保持统一性和规范性五、通过phpcms设置html文件名规则1. 登入phpcms后台管理系统2. 进入“系统设置”-“URL规则”菜单3. 在“生成HTML文件名规则”中进行相应的设置4. 保存设置并更新缓存六、html文件名规则的修改和调整1. 全球信息站运营过程中可能需要调整html文件名规则2. 涉及到文件命名规则的修改需要谨慎操作3. 修改后需要及时更新全球信息站地图和索引文件七、总结html文件名的规则对于phpcms全球信息站的建设和优化至关重要，合理的文件名规则可以提高全球信息站的SEO效果，增强用户体验，优化全球信息站性能和速度。
在实际操作中，需要根据全球信息站的特点和运营需求来设计和调整html文件名规则，以达到更好的效果和效益。
phpcms生成html文件的名字规则是非常重要的，可以直接影响全球信息站的SEO效果以及用户体验。
在建设和维护phpcms全球信息站时，需要对html文件的名字规则进行合理的设置和调整，以确保全球信息站能够更好地为用户提供优质的内容和服务。
html命名规范
html命名规范HTML命名规范是为了保持代码的可读性和可维护性而制定的一些规则。
下面是一套常用的HTML命名规范，包括标签、类名、ID等的命名方式。
标签的命名规范：1. 标签名应该采用小写字母。
2. 标签名应该能准确地描述元素的内容和用途，尽量避免使用无意义的标签名。
例如使用`<div>`来表示一个段落就不够准确。
类名的命名规范：1. 类名应该由小写字母、数字和破折号（-）组成。
2. 类名应该能准确地描述元素的样式和用途。
例如，如果一个类名表示一个按钮的样式，可以使用类似`btn`的命名。
3. 类名应该简洁明了，尽量避免过长的类名。
ID的命名规范：1. ID应该由小写字母、数字和破折号（-）组成。
2. ID应该唯一，每个元素只能拥有一个ID。
3. ID应该用于唯一标识一个元素，而不是用于样式。
注释的命名规范：1. 注释应该清晰地描述代码的作用和用途。
2. 注释应该放置在代码的上方，可以在注释前加上一行分割线，增加可读性。
文件和文件夹的命名规范：1. 文件名应该采用小写字母，单词之间可以使用破折号（-）或下划线（_）分隔。
2. 文件夹名应该采用小写字母，单词之间可以使用破折号（-）或下划线（_）分隔。
属性的命名规范：1. 属性名应该采用小写字母。
2. 属性名应该能准确地描述属性的用途，尽量避免使用无意义的属性名。
总结：HTML命名规范是为了提高代码的可读性和可维护性而制定的一些规则。
通过合理地命名标签、类名、ID等，我们可以更好地理解和维护代码。
同时，命名规范也有助于团队间的协作，提高代码的一致性和可扩展性。
HTML命名规范！
HTML命名规范！HTML基础设施（1）⽂件应以<!DOCTYPE.....>⾸⾏顶格开始，这句话告诉浏览器这是⼀个什么⽂件，我们推荐使⽤<!DOCTYPE html>。
（2）必须在head元素内部的meta标签内声明⽂档的字符编码charset, 如：<meta charset="UTF-8">，这句代码告诉浏览器应该此HTML⽂件使⽤的字符集是什么，如果不加此⾏代码，那么在浏览器中可能显⽰为乱码。
（3）页⾯的title是极为重要的不可缺少的⼀项。
2.HTML代码结构和视觉顺序基本保持⼀致（1）.按照从上之下，从左到右的视觉顺序书写HTML结构。
（2）.有时候为了便于搜索引擎抓取，我们也会将重要内容在HTML结构顺序上提前，以为搜索引擎抓取⽹页内容是⾃上⽽下的，所以将重要内容在HTML结构顺序上提前可便于抓取重要的内容。
（3）.不要使⽤table布局，现在基本上被淘汰了，⽽应该代之以div来布局，⽅便控制。
3.结构、表现、⾏为三者分类，避免内联。
（1）.使⽤link引⼊外部css⽂件到head中。
注意：⼀般我们不适⽤@import来引⼊外部css⽂件。
（2）.使⽤script将js⽂件引⼊，并置于body底部，这时js⽂件会最后加载，html会最先加载，⽤户体验会更好。
4.保持良好的树形结构每⼀个块级元素都另起⼀⾏，每⼀⾏都使⽤Tab缩进对齐（head和body的⼦元素不需要缩进）。
删除冗余的⾏尾的空格。
使⽤4个空格代替1个Tab（⼤多数编辑器中可设置）。
对于内容较为简单的表格，建议将tr写成单⾏。
你也可以在⼤的模块之间⽤空⾏隔开，使模块更清晰。
!DOCTYPE html><html><head><meta charset="UTF-8"><title>404</title><meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/><meta http-equiv="X-UA-Compatible" content="ie=edge"><style></style></head><body><div class="box"><div class="box__img"><p>******</p></div><div class="box__desc"><p>******</p><ul><li>******</li></ul></div></div></body></html> 5.其他需要注意的问题（1）.⼀个标签上引⽤的className不要过多，越少越好。
html页面以及CSS函数命名规则
博图广告html页面以及CSS函数命名规则页面插入FLASH标准方法<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="/pub/shockwave/cabs/flash/swflash.cab#version= 9,0,19,0" width="400" height="495" name="Movie1" id="Movie1"><param name="allowScriptAccess" value="sameDomain" /><param name="movie" value="swf/Video.swf"><param name="quality" value="high"><param name="wmode" value="transparent"><!--此处根据页面需要决定是否添加--><embed src="swf/Video.swf" quality="high" allowscriptaccess="sameDomain" wmode="transparent" pluginspage="/go/getflashplayer" type="application/x-shockwave-flash" width="400" height="495" name="Movie1" id="Movie1"></embed></object>参数，ID和NAME根据需要命名插入常规视频代码（avi,mov,wmv,rm,asf）(实际调用系统mediaplayer)<embed src="320-180-2.mov" type="video/x-ms-wmv" width="480" height="360" autoStart="1" showControls="1" showstatusbar="1" />参数autoStart=-1表示循环0 表示停止1表示播放1次其它的1表示显示0表示隐藏页面HTML标准布局常规页面只有上下，上中下，左右，左中右等布局，其它基本就是常规布局的组合，所以我们在定义页面时，从一开始就要考虑清楚，需要共用部分一定要单独定义，确保每个页面调用同一样式显示效果都一致。
html类，id命名规范
html类，id命名规范[转⽂]⽹页中使⽤规范的css和id命名原则，有利于提⾼团队效率，减少后期维护成本，良好的结构对SEO（搜索引擎优化）也有作⽤，是对代码的优化是⼀个很关键的步骤。
⼀、⽹页外层重要部分css样式命名：外套 wrap ------------------⽤于最外层头部 header ----------------⽤于头部主要内容 main ------------⽤于主体内容（中部）左侧 main-left -------------左侧布局右侧 main-right -----------右侧布局导航条 nav -----------------⽹页菜单导航条内容 content ---------------⽤于⽹页中部主体底部 footer -----------------⽤于底部⼆、css/ID命名参考表CSS样式命名说明#wrapper页⾯外围控制整体布局宽度#container或#content容器,⽤于最外层#layout布局#head, #header页头部分#foot, #footer页脚部分#nav主导航#subnav⼆级导航#menu菜单#submenu⼦菜单#sideBar侧栏#sidebar_a,#sidebar_b左边栏或右边栏#main页⾯主体#tag标签#msg #message提⽰信息#tips⼩技巧#vote投票#friendlink友情连接#title标题#summary摘要#loginbar登录条#searchInput搜索输⼊框#hot热门热点#search搜索#search_output搜索输出和搜索结果相似#searchBar搜索条#search_results搜索结果#copyright版权信息#branding商标#logo⽹站LOGO标志#siteinfo⽹站信息#siteinfoLegal法律声明#siteinfoCredits信誉#joinus加⼊我们#partner合作伙伴#service服务#regsiter注册arr/arrow箭头#guild指南#sitemap⽹站地图#list列表#list列表#homepage⾸页#subpage⼆级页⾯⼦页⾯#tool, #toolbar⼯具条#drop下拉#dorpmenu下拉菜单#status状态#scroll滚动.tab标签页.left .right .center居左、中、右.news新闻.download下载.banner⼴告条(顶部⼴告条)电⼦贸易相关.products产品.products_prices产品价格.products_description产品描述.products_review产品评论.editor_review编辑评论.news_release最新产品.publisher⽣产商.screenshot缩略图.faqs常见问题.keyword关键词.blog博客.forum论坛三、⽂件命名参考表CSS⽂件命名说明master.css,style.css主要的module.css模块base.css基本共⽤layout.css布局，版⾯themes.css主题columns.css专栏font.css⽂字、字体forms.css表单mend.css补丁print.css打印。
前端开发规范文档
前端开发规范文档规范目的为提高团队协作效率，便于后端开发人员添加功能及前端后期优化维护，输出高质量的代码，特制定该文档。
本规范文档一经确认, 前端开发人员必须按本文档规范进行前端开发。
本文档如有不对或者不合适的地方请及时提出。
经讨论决定后方可更改。
基本准则符合web标准，语义化html，结构表现行为分离，兼容性优良。
页面性能方面，代码要求简洁明了有序，尽可能的减小服务器负载，保证最快的解析速度。
一、html 文件命名及编写规范1、命名规则采用小写英文字母|| _的组合命名，菜单名_功能名称，后缀.html。
如：manage_list.html（管理列表）、manage_add.html（新增）、manage_edit.html（修改）、manage_detail.html（详情）。
同时将页面放在其对应的模块划分目录中。
2、编写规范：(1)文档类型声明及编码统一为html5声明类型“<!DOCTYPE html>”;(2)编码统一为<meta charset="utf-8" />, 书写时利用IDE实现层次分明的缩进;(3)区域块、功能组件以及需要标注的地方，插入注释。
(4)在布局文件结构时，应遵循语义化标签（该用p不要用div、该用ul、li不要用p，h标签应根据标题层级合理利用）、代码结构简单、清晰明了，少用标签、少套结构（一段结构布局中 1个标签能解决的不要用2个，套2层结构能解决的不要套3层）的基本原则。
代码标签、结构嵌套示例：目标效果图代码结构嵌套<ul><li><h4>罗田县九资河徐冲药材</h4><img src=”***.jpg”><div><h3>茯苓</h3><p>小丁</p><p class=”color_red”>32元/公斤</p></div></li></ul>代码分析：根据目标效果图，实现的代码部分别使用了ul/li /h4/ img /div /h3/ p 这些标签。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
网页切图过程中div+css命名规则
内容：content/container 导航：nav 侧栏：sidebar
栏目：column 标志：logo 页面主体：main
广告：banner 热点：hot 新闻：news
下载：download 子导航：subnav 菜单：menu
搜索：search 页脚：footer 滚动：scroll
版权：copyright 友情链接：friendlink 子菜单：submenu
内容：content 标签页：tab 文章列表：list
注册：regsiter 提示信息：msg 小技巧：tips
加入：joinus 栏目标题：title 指南：guild
服务：service 状态：status 投票：vote
尾：footer 合作伙伴：partner 登录条：loginbar
页面外围控制整体布局宽度：wrapper 左右中：left right center
(二)注释的写法:
/* Footer */
内容区
/* End Footer */
(三)id的命名:
(1)页面结构
容器: container 页头：header 内容：content/container
页面主体：main 页尾：footer 导航：nav
侧栏：sidebar 栏目：column 左右中：left right center
页面外围控制整体布局宽度：wrapper
(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
(四)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 主题themes.css 专栏columns.css 打印print.css
文字font.css 表单forms.css 补丁mend.css 布局，版面layout.css。