HTML基础1 - 爱码网

一、什么是HTML

WEB技术包含了两大部分

客户端技术(前端)：运行在客户端，由浏览器来负责解析和执行。主要由HTML(负责内容)、CSS(内容显示效果)、JAVASCRIPT(客户与内容的交互响应)

服务器端技术(后台):运行在服务器端，接收客户端的信息，进行处理并与数据库交互，主要有PHP、ASP.NET、JSP(JAVA)

HTML:

一种超文本标记语言，是纯文本语言

用于设计网页的内容，文件以.html或.htm结尾

通过浏览器来解析执行

浏览器：

以图形化的方式显示HTML

用于HTML的解析器，然后渲染呈现给用户

二、HTML语法

标记：HTML的一切内容都是以标记作为基础的

HTML中定义了很多的标记用于描述HTML的功能

以<开头，以>结尾

HTML中标记分为封闭标记和非封闭标记两种

非封闭标记语法(不需要包括住内容数据)：

属性：

通用属性：绝大部分HTML标记都拥有的属性例如:id、name、title、style、class

标记和元素:

标记的作用是用于通过默认设置的样式来显示文本内容

HTML文档结构

文档类型定义: <!DOCTYPE html>

HTML必须包含一个html封闭标记，表示着是一个HTML文档

里面有两个子标记 head 文件头

body 身体

三、头标记head

主要用于设置当前html文件的设置信息

可以包含title(标题)、meta(设置信息)、script(引入JavaScript代码段)、

style(引入样式代码段)、link(连接设置)

<!--实现定时刷新并跳转到一个新页面上 http-equiv 设置消息头，设置的值由content中

的值来决定

-->

<!--设置外部连接文件 rel表示引入的数据的类型 stylesheet表示样式表

href指定连接地址

type用于告诉html这个文件的打开格式是text/css

-->

四、body标记

1.文本标记

不加任何标记书写的文本会按浏览器默认方式显示

如果使用文本标记包含文本，则会按文本标记预先设定好的样式来显示。

文本与特殊字符

多个空格或者其他的制表符、换行符都会被压缩成单个空格，只会以一个空格字符来显示。

在html中有许多特殊字符，不能直接使用需要通过实体引用(转义)来替代

< <

> >

空格符号  

2.标题标记hn

标题标记是用于醒目方式显示文字，可以从h1~h6

(会独占一行，也就是说h标记不管前面有任何内容，都会被换行后再显示)

3.段落标记p

是一种以结构化显示文本的标记，让元素内容独占一个段落

4.分区标记 div、span

分区元素有行内分区与块分区

div是块分区，会独占一行

span是行内分区，不会独占一行

分区元素常用于页面的布局和设计

6.列表

列表是将一些相似特征或者是有顺序的数据进行对齐排列

列表是由列表类型(<ol>或<ul>)和列表项(<li>)

列表类型：ol是有序列表、ul是无序列表

列表项:具体显示内容的标记 li

有序列表

元素有特定的顺序，各个列表按编号来显示

语法:

<ol>

<li>列表项的内容</li>

</ol>

无序列表

元素没有特定的顺序，各列表项前面没有编号，只有一些无顺序符号

语法：

<ul>

<li>列表项的内容</li>

</ul>