0x01 什么是HTML
HyperText Markup Language，超文本标记语言，不是编程语言。
HTML使用一套标记标签来描述网页。（例：<html> </html>）
用于创建网页的标准标记语言，运行在浏览器上，由浏览器来解析。浏览器不直接显示HTML标签，标签决定如何展现HTML页面的内容。
HTML文档：包含了HTML标签以及文本内容，也叫Web页面。
0x02 HTML网页结构
HTML网页结构
只有白线框起来的部分才会在浏览器中显示出来，即<body>标签内的部分。
0x03 文本格式化
文本格式化
0x04 样式 CSS
添加方式
- 内联样式：在HTML元素中使用"style"属性。
- 内部样式表：在HTML文档头部<head>区域使用<style>元素来包含CSS
- 外部引用：使用外部CSS文件。【最佳选手】
内联样式
语法：
<h1 style="background-color:red;font-size:white;">A TITLE</h1>
不同属性之间用分号分隔，用分号结尾。
内联样式
内部样式表
在<head>部分通过<style>标签定义。对单个文件定义的特别样式。
内部样式
外部引用
在<head>中用link标签引用。
外部引用
0x05 链接
标签<a>设置超文本链接，语法如下:
<a herf="url">链接文本/图片/其他HTML元素</a>
默认情况下，未访问过的链接显示为蓝色带下划线的字体，访问过的显示为紫色带下划线的字体，点击链接时，显示为红色带下划线的字体。
属性
target
定义被链接的内容在哪里显示。
在新窗口打开被链接文档
默认情况
在父框架打开被链接文档
在整个窗口中打开被链接文档
当属性值为framename时，可在指定框架中打开连接文档。
使用框架可以让多个页面在同一个浏览器窗口中显示，每一个HTML文档都是一个独立的框架。框架解释
在上图中，就包含了一个浏览器窗口，三个页面，即存在三个独立的框架。
id
用于创建一个HTML文档的书签标记，在HTML文档中不显示。
该属性规定HTML元素唯一的id，可作用链接锚，通过JavaScript或CSS为带指定id元素改变、添加样式。
0x06 图像
语法：
<img src="url" alt="text" width="500" height="200" border="2">
释义：
src：图片源，即图像url地址。
alt：当浏览器无法加载图像时所显示的文字信息，告诉读者所失去的信息。
width、height：设置图片高度与宽度。
border：设置图片边框大小。
创建图像链接时
<a herf="url"> <img border="2" sec="url" alt="text"> </a>
创建图像映射
即创建带可供点击区域的图像地图。每个区域都是一个超级链接。
此代码示例源自菜鸟教程
- 矩形，左上角顶点坐标为(x1,y1)，右下角顶点坐标为(x2,y2)。
<area shape="rect" coords="x1,y1,x2,y2" href="url"> - 圆形，圆心坐标为(x1,y1)，半径为r。
<area shape="circle" coords="x1,y1,r" href="url"> - 多边形，各顶点坐标依次为(x1,y1)、(x2,y2)、(x3,y3) ......
<area shape="poly" coords="x1,y1,x2,y2 ......" href="url">
0x07 列表
-
无序列表
无序列表
-
有序列表
有序列表
-
自定义列表
自定义列表
0x08 表单
使用标签<form>来设置。
表单
在测试的时候，出现了低级问题，直接打开html文档，导致一直php页面没有输出，还以为是代码问题，找了很久的原因无果。感谢sgdream大佬的指点。
要用127.0.0.1去访问html文档，不然就是直接打开这个页面。
最后，这一部分的基础语言就整理就先这样啦，后续觉得有要再补充的，就随缘补充了。
网友评论