HTML指的是超文本标记语言,它是用来描述网页的一种语言。
HTML不是一种编程语言,而是一种标记语言。
标记语言是一套标记标签。
所谓超文本,有两层含义:
1.它可以加入图片、声音、动画、多媒体等内容(超越了文本限制)。
2.它还可以从一个文件跳转到另一个文件,与世界各地的文件连接(超级链接文本)。
1.HTML标签是由尖括号包围的关键词,例如
2.HTML标签通常是成对出现的,双标签
3.有些特殊的标签必须是单个标签,单标签
4.双标签关系可以分为两类:包含关系和并列关系
<html>
<head>
<title>我的第一个页面title>
head>
<body>
我的第一个HTML页面
body>
html>
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documenttitle>
head>
<body>
body>
html>
DOCTYPE html>
用来定义当前文档显示的语言。
2.2.1 en定义语言为英语
2.2.2 zh-CN定义语言为中文
简单来说,定义为en就是英文网页,定义为zh-CN就是中文网页
字符集(Character set)是多个字符的集合,以便计算机能够识别和存储各种文字。
在标签内,可以通过==标签的charset==属性来规定HTML文档应该使用哪种字符编码
<meta charset="UTF-8">
就是指标签的含义,即这个标签是用来干嘛的。
根据标签的语义,在合适的地方给一个最为合理的标签,可以让页面结构更清晰。
<h1>
我是一级标题
h1>
特点:1.加了标题的文字会变的加粗,字号也会依次变大。
2.一个标题独占一行。
<p>
我是一个段落标签
p>
<br />
特点:
加粗: 或者
倾斜: 或者
删除线: 或者
下划线: 或者
div:表示分割、分区。
span:意为跨度、跨距。
特点:
1.
2.标签用来布局,一行上可以多个。小盒子
标签用于定义HTML页面中的图像。
<img src="图像url"/>
src是标签的必须属性,它用于指定图像文件的路径和文件名。
alt是替换文本,图像显示不出来的时候用文字替换。
title是提示文本,鼠标放到图像上,提示文字
width 给图像设定宽度
height 给图像设定高度
border 给图像设定边框
目录文件夹:就是普通文件夹,里面存放着我们做页面所需要的相关素材。
根目录:打开目录文件夹的第一层就是根目录
相对路径:以引用文件所在位置为参考基础,而建立出的目录路径。
绝对路径:是指目录下的绝对位置,直接到达目标位置,通常是从盘符开始的路径。
用于定义超链接,作用是从一个页面链接到另一个页面。
1.超链接的语法格式
<a href = "跳转目标" target = "目标窗口的弹出方式">文本或图像a>
2.链接的分类
外部链接:target 打开窗口的方式 ,默认值是 _self 当前窗口打开网页 _blank 新窗口打开页面
内部链接:网站内部页面之间的相互链接
下载链接:如果href里面地址是一个文件或者压缩包,会下载这个文件
地址链接的是 文件.exe 或者是 zip 等压缩包形式
网页元素链接:在网页中的各种网页元素,如文本、图像、表格、音频、视频等都可以添加超链接。
锚点链接:点我们点击链接可以快速定位到页面中的某个位置
便于阅读和理解但又不需要显示在页面中的注释文字。
HTML中的注释以" "结束
在HTML页面中,一些特殊的符号很难或者不方便直接使用,此时我们就可以使用特殊字符代替
如:空格符 + ; ; < 小于号 < + ; 等
表格主要用于显示,展示数据。
<table>
<tr>
<td>单元格内的文字td>
<th>表头单元格th>
tr>
table>
table 是用于定义表格的标签。
tr 标签用于定义表格中的行,必须嵌套在table标签中。
td 用于定义表格中的单元格,必须嵌套在tr标签中。
字母td指表格数据,即数据单元格的内容。
th 表头单元格位于表格的第一行或者第一列,表头单元格里面的文本内容加粗居中显示。
表格属性:align :规定表格相对周围元素的对齐方式
border:规定表格单元是否拥有边框
cellpadding:规定单元边沿与其内容之间的空白
cellspacing:规定单元格之间的空白
width:规定表格的宽度
合并单元格:(1)合并方式:跨行合并:rowspan=“合并单元格的个数” ,跨列合并:colspan=“合并单元格的个数”
(2)目标单元格:跨行:最上侧单元格为目标单元格 ,跨列:最左侧为目标单元格
(3)合并单元格的步骤:先确定是跨行还是跨列,找到目标单元格,写上合并方式 = 合并的单元格数量。最后删除多余的单元格。
列表作用用来布局
列表可以分为三大类:无序列表,有序列表和自定义列表。
<ul>
<li>列表项li>
<li>列表项li>
ul>
<ol>
<li>列表项li>
<li>列表项li>
ol>
<dl>
<dt>名词1dt>
<dd>名词1解释1dd>
<dd>名词1解释2dd>
dl>
1.表单的组成:表单域,表单控件(也称表单元素)和提示信息3部分构成。
2.表单域是一个包含表单元素的区域,会把它范围内的表单元素信息提交给服务器。
<form action="url地址" method="提交方式" name="表单域名称">
各种表单元素控件
form>
2.3自定义列表==(重点)==
<dl>
<dt>名词1dt>
<dd>名词1解释1dd>
<dd>名词1解释2dd>
dl>
1.表单的组成:表单域,表单控件(也称表单元素)和提示信息3部分构成。
2.表单域是一个包含表单元素的区域,会把它范围内的表单元素信息提交给服务器。
<form action="url地址" method="提交方式" name="表单域名称">
各种表单元素控件
form>