珍爱网--缘来网项目前端文档_前端项目文档资源-CSDN下载

3星 · 超过75%的资源需积分: 9 6 浏览量 2012-03-20 16:32:19 上传评论收藏 45KB DOC 举报

### 知识点详解 #### 一、HTML5与XHTML1.0的差异及约定 **1. 文档类型声明（DOCTYPE）** - **XHTML 1.0**: 使用较复杂的DTD（Document Type Definition）声明，如： ``` <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> ``` - **HTML5**: 简化为`<!DOCTYPE HTML>`，无需指定DTD。 - **命名空间（xmlns）**: 在XHTML 1.0中需要明确指定，而HTML5默认包含此命名空间。 **2. 标签约定** - **标签配对与结束**: - 成对标签（如`<div>`、`<p>`等）需合理关闭。 - 单体标签（如`<br>`、`<img>`等）无需添加尾部斜杠（即`<br>`而非`<br/>`），以保持简洁性。 - **属性约定**: - 去除不必要的`type`属性，例如`<script type="text/javascript">`简化为`<script>`。 #### 二、样式和JS引用约定 **1. 样式引用** - 每个页面仅允许通过`<link>`标签引入一个样式表，其余样式通过`@import`引入。 - 样式文件需声明编码格式，如`@charset "utf-8";`。 **2. JavaScript引用** - 统一使用LAB.js进行JS文件加载。 - 页面内的非公共JS应独立成文件，并通过LAB.js加载。 - 页面上不应出现内联JS代码，所有JS逻辑需封装于单独文件中。 #### 三、HTML5新增结构标签及其用途 **1. 新增标签** - **`<article>`**: 定义独立的内容块，如新闻文章或博客条目。 - **`<aside>`**: 与`<article>`关联的内容，如侧边栏评论或广告。 - **`<section>`**: 文档或页面的一部分，通常包含主题相关的多个`<article>`。 - **`<hgroup>`**: 一组相关的标题，如`<h1>`和`<h2>`。 - **`<nav>`**: 包含页面导航链接的容器。 - **`<header>`**: 定义页面头部信息，如logo和导航。 - **`<footer>`**: 定义页面底部信息，如版权声明和联系信息。 - **`<details>`**与**`<summary>`**: `details`用于展示额外的详细信息，而`summary`作为其标题。 - **`<figure>`**: 用于组织图片、图表等多媒体内容及其标题。 - **`<figcaption>`**: 作为`<figure>`的标题。 #### 四、文件组织与命名规范 **1. 文件目录结构** - 静态页面工作目录：`E:\work\html\yuanlai` - 模块文件夹下包含： - 设计稿与切图文件夹 - `javascript`文件夹 - `jQuery`及插件文件夹 - 其他脚本插件文件夹 **2. CSS命名规范** - **简单样式**: `.abc`。 - **复杂样式**: `.a_b`。 - **特殊处理样式**: `.a-b`。 - 示例：`.first-child`样式即使未被CSS调用，在高级浏览器中仍能保留某些样式效果。 ```css /* 奖品列表首行效果 */ .choujiang_game_list ul li:first-child, .choujiang_game_list ul li.first-child { border-top: none; } .choujiang_game_list ul li:first-child strong, .choujiang_game_list ul li.first-child strong { color: #FF6600; } .choujiang_game_list ul li:first-child em, .choujiang_game_list ul li.first-child em { font-weight: bold; } ``` 通过以上分析，我们可以看出《珍爱网--缘来网项目前端文档》提供了详细的HTML5页面结构搭建、样式与JS管理、文件组织以及CSS命名等方面的规定，旨在确保项目的高质量与一致性。这对于维护大型前端项目至关重要，有助于提高团队协作效率并减少后期维护成本。

资源推荐

资源详情

资源评论