1.html概述
平时我们打开一个网页,比如
我们可以看到浏览器会展示一个有一定结构、好看的样式、动态效果的页面给我们,要想构成这样一个网页,需要的基本元素有三个,也被称为前端三剑客,即html+css+js
首先学习网页的基本结构——html,用来一个页面如何布局,有哪些东西(元素或者标签)的超文本标记语言,
什么是超文本标记语言?首先看看什么是文本?
我们打开记事本输入一句话,保存,这个文件就是一个文本。
我们再次打开将这句话用如下两个h1包裹,保存并将这个test.txt文件改为test.html
单击打开,出现加粗放大的效果
就是因为我们加入了h1(还有很多类似元素)这种文本——“超文本”,使得页面内可以出现标题(放大加粗),链接,甚至包含图片、音乐、视频等非文字元素,这里要强调的是这些超文本只是用来标记当前元素展示的形式,比如是标题还是链接或者图片,并不是描述当前元素的样式,即什么颜色、长宽、字体样式等,这些就是后面要学的css
test.html的文件是什么格式的文件?
可以简单的理解为html文件是一种网页文件,比如txt就是文本文件,png就是图片文件
HTML 标签
- HTML 标签是由尖括号包围的关键词,比如 <html>
- HTML 标签通常是成对出现的,比如 <b> 和 </b>
- 标签对中的第一个标签是开始标签,第二个标签是结束标签
- 开始和结束标签也被称为开放标签和闭合标签
HTML 元素
"HTML 标签" 和 "HTML 元素" 通常都是描述同样的意思.
但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签
2.html完整结构
<!DOCTYPE> 声明
<!DOCTYPE>声明有助于浏览器中正确显示网页。
网络上有很多不同的文件,如果能够正确声明HTML的版本,浏览器就能正确显示网页内容。
doctype 声明是不区分大小写的,以下方式均可:
<!DOCTYPE html>
<!DOCTYPE HTML>
<!doctype html>
<!Doctype Html>
通用声明
HTML5
<!DOCTYPE html>
HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
中文编码
目前在大部分浏览器中,直接输出中文会出现中文乱码的情况,这时候我们就需要在头部将字符声明为 UTF-8 或 GBK。
公众号 java一号 更多java实战项目资料、技术干活。更重要的是小猿愿成为你编程路上的一个朋友!
首发公众号: java一号