HTML 网页开发、CSS 基础语法——六. HTML基本结构
1.基本骨架
HTML文件最基本的四个标签,组成了网页的基本骨架,包括:<html>、
<head>、<title>、<body>四组标签。
① <html>标签
作用:定义HTML文件的根元素,表示整个的HTML文档,所有的标签要书写在<html>标签内部。
② <head>标签
作用:用于存放<title>,<meta>,<base>,<style>,<script>,<link>。内部用于对网页的设置,除了<title>内部的文字,其他标签都不显示在浏览器上。 注意在<head>标签中我们必须要设置的标签是title。
③ <title>标签
作用1:让页面拥有一个属于自己的标题。
作用2:title中的关键字可以作为搜索引擎抓取时的关键字,提高SEO搜索引擎优化。
作用3:内部的内容会显示在搜索结果的标题部分。
作用4:作为浏览器收藏夹默认的网页标题。
建议网页必须添加title标签内部内容,内容尽量精简,提取网页的关键字。
④ <body>标签
作用:定义网页的主体部分,用于存放所有的HTML显示内容的标签<p>,<h1>,<a>,<div>等。
<body>内部的元素内容会显示在浏览器的窗口中。
2. DTD
① 什么是DTD
• 完整的HTML文件的第一行内容叫做文档定义类型,英文DocType Definition,简称DTD。也称作文档声明类型,DocType Declaration。
• 作用:告知浏览器该网页使用的是哪个版本的HTML规范,让浏览器按照对应版本的HTML语法进行解析页面。
② 不同版本的DTD
(1) XHTML1.0版本
<!DOCTYPE html PUBLIC " -//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
(2) HTML5版本
<!DOCTYPE html>
3.命名空间
① <html>元素表示整个网页文档,在开始标签上设置了命名空间xmlns属性。
② XHTML1.0版本
<html xmlns=" http://www.w3.org/1999/xhtml" xml:lang="en" ></html>
③ HTML5版本
<html lang="en" ></html>
④命名空间xmlns
(1) xml:可扩展标记语言,使用在传输过程中的规范。被设计用来传输和存储数据,是html的补充。
(2) xmlns:全称叫做XML NameSpace,NameSpace叫做命名空间,浏览器会将此命名空间
用于该属性所在元素内的所有内容。
(3) <html>元素的命名空间规定了在不同用户的浏览器中标签语义遵循的统一标准,避免出现标签名冲突,这个标准使用的就是一个固定的网址http://www.w3.org/1999/xhtml中的规范。
⑤语言
(1)xml:lang="en" 和lang="en" 表示所有的标签元素内容的语言都是英语,对搜索引擎和浏览器是有帮助的。
(2) lang=" zh-cn" 表示中文(中国)
4.字符集
①字符集
(1) <head>标签内部的<meta>标签通过http-equiv属性定义了当前的网页所使用的字符编码。
(2) char:character,字符。set:集合。
(3) XHTML1.0版本
<meta http-equiv=" Content-Type" content=" text/html;charset=UTF-8" >
(4) HTML5版本
<meta charset=" UTF-8" >
②字符集常见问题
使用情况建议:
(1)如果没有网页加载速度要求,或者制作的是外文网站,使用utf-8。
(2)如果含有大量中文汉字的网站,而且要求网页加载速度快,使用gbk。
注意:meta标签声明的字库,必须和编辑器软件默认编译字库相同,否则会出现两个字库不匹配,浏览器加载时出现乱码。
最新文章
- CocoaPods 1.1.0上传遇到swift问题
- emmet的使用
- 执行超过1个小时的SQL语句
- linux上svn版本库创建小记
- Linux之awk命令详解
- Android:ListView之ViewHolder
- MySQL 面试基础
- HDU 4022 Bombing (map + multiset)
- shell 批量压缩指定文件夹及子文件夹内图片
- 浏览器兼容问题 chrome iframe location href
- Android高效率编码-findViewById()的蜕变-注解,泛型,反射
- WEB站点服务器安全配置
- Spring Security默认的用户登录表单 页面源代码
- Java8中的HashMap分析
- mac上使用jmeter录制web项目和手机app
- leetcode 2. Add Two Numbers [java]
- Upload文件时出现";Cannot access a closed file";错误
- 在input中既隐藏边框,也隐藏轮廓的设置
- Linux中Readlink命令
- ubuntu16.04服务器apache的ssl证书配置