HTML常用的标签有哪些及如何使用

今天小编给大家分享一下HTML常用的标签有哪些及如何使用的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我们一起来了解一下吧。

创新互联公司是一家专注于成都网站设计、网站制作与策划设计,武都网站建设哪家好?创新互联公司做网站,专注于网站建设10多年,网设计领域的专业建站公司;建站业务涵盖:武都等地区。武都做网站价格咨询:18980820575

浏览器

• 浏览器也是一个客户端

#这是一个服务器，我们通过浏览器就可以访问的到服务器发送的"hello"
import socket
sk = socket.socket()
sk.bind(('127.0.0.1',8080))
sk.listen(5)
while True:
    conn,addr = sk.accept()
    data = conn.recv(1024)
    conn.send(b"HTTP/1.1 200 ok\r\n\r\n")  #必须要加上这一句，不然浏览器不认识
    conn.send(b"hello")
    conn.close()

• 浏览器不通过服务端也可以渲染文本

HTML

什么是HTML

HTML全称HyperText Markup Language，超文本标记语言，是一种描述性的标记语言。

• 超文本：音频、视频、图片

• 标记：<英文单词或者字母>称为标记，一个HTML页面都是由各种标记组成。

HTML的作用

负责描述文档语义的语言

编写HTML的规范

1）所有标记元素都要正确的嵌套，不能交叉嵌套。eg：

2）所有标记都必须小写

3）所有标记都必须关闭

• 双标签：

• 单标签：

4）所有属性值必须加引号。eg：

5）所有属性必须有值：首页

HTML结构

用pycharm新建一个HTML文件，文件会自动生成如下代码的一个HTML模板

HTML常用标签

head内常用标签

基本标签

meta标签

body内常用标签

基本标签

加粗
斜体
下划线
删除

段落标签，写在这个标签内的东西就是一个段落

1号标题
2号标题
3号标题
4号标题
5号标题
6号标题

特殊字符

 


>


<


&


¥


©


®

div标签和span标签

div标签:

    



span标签:

    


**块级标签与内联标签的区别**
块级标签：另起一行开始渲染元素
内联标签：不需要另起一行
如果单独在网页中插入这两个元素，不会对页面产生任何的影响，他们是专门为定义CSS样式而生的

注意：

? 块级标签可以嵌套内联标签或者某些块级标签

? 内联标签不能嵌套块级标签

? ==p标签不能嵌套块级标签，也不能嵌套p标签==

img标签

a标签

a标签又叫做超链接标签

所谓的超链接是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序

我们就先拿另一个网页举例

href属性指定目标网页地址。该地址可以有几种类型：

绝对URL - 指向另一个站点（比如 href="http://www.jd.com）
相对URL - 指当前站点中确切的路径（href="index.htm"）
锚URL - 指向页面中的锚（href="#top"）

点我会跳转哦！



点我会跳转哦！



点我会跳转哦！



点我回到加粗



点我转到这个网页哦！

列表

    
第一项
    
第二项
    
第三项

type属性：

• type="disc"(实心圆点，默认值)

• type="circle"(空心圆圈)

• type="square"(实心方块)

• type="none"(无样式)

    
第一项
    
第二项
    
第三项

type属性：

• 1 数字列表，默认值

• A 大写字母

• a 小写字母

• Ⅰ大写罗马

• ⅰ小写罗马

start属性：

start="3"只能写数字，表示从第3个开始

    
标题1
        
内容
    
标题2
        
内容1
        
内容2

表格

    
    
        
        
        
    
    
    
        
        
        
    
     
        
        
        
    
序号
姓名
爱好
1
yjy
跳舞
2
wwb
唱歌

属性：

• border: 表格边框 eg：border="6"

• cellpadding: 内边距 eg：cellpadding="8"

• cellspacing: 外边距 eg：cellspacing="2"

• width: 像素 百分比 eg：width="100%"

以上这些属性要在

• rowspan: 单元格竖跨多少行（上下合并单元格） eg：rowspan="3"

• colspan: 单元格横跨多少列（左右合并单元格） eg：colspan="2"

以上这些属性要在