HTML标签

html标签分类

html标签又叫做html元素,它分为块级元素内联元素(也可以叫做行内元素),都是html规范中的概念。

标题 h1 h2 h3 h4 h5 h6
列表 ol ul li dl dt dd
排版标签 p div hr center pre
表格 table
表单 form

块级元素

块级元素是指本身属性为display:block;的元素。因为它自身的特点,我们通常使用块级元素来进行大布局(大结构)的搭建。

块级元素的特点:

独占一行,每一个块级元素都会从新的一行重新开始,从上到下排布
可以直接控制宽度、高度以及盒子模型的相关css属性
在不设置宽度的情况下,块级元素的宽度是它父级元素内容的宽度
在不设置高度的情况下,块级元素的高度是它本身内容的高度

内联元素

粗体 斜体 上下标 划线
字体 b em sup del/s
strong i sub u
排版 span br
超链接 a
图片 img

内联元素是指本身属性为display:inline;的元素。因为它自身的特点,我们通常使用块级元素来进行文字、小图标(小结构)的搭建。

内联元素的特点:

和其他内联元素从左到右在一行显示
不能直接控制宽度、高度以及盒子模型的相关css属性,但是直接设置内外边距的左右值是可以的
内联元素的宽高是由本身内容的大小决定(文字、图片等)
内联元素只能容纳文本或者其他内联元素(此处请注意,不要在内联元素中嵌套块级元素)

文本级和容器级

除此之外,从HTML的角度来讲,标签还可以分为文本级和容器级

  • 文本级标签:p、span、a、b、i、u、em。
  • 容器级标签:div、h系列、li、dt、dd。

文本及标签的意思是标签中只可以放文本,不可以放其他内容。你会发现除了p之外,所有的文本级标签,都是行内元素。p是个文本级,但是是个块级元素。 

PS:为甚么说p是文本级标签呢?因为p里面只能放文字&图片&表单元素,p里面不能放h和ul,p里面也不能放p。

html中的特殊字符

  •  :空格 (non-breaking spacing,不断打空格)
  • <:小于号(less than)
  • >:大于号(greater than)
  • &:符号&
  • ":双引号
  • ':单引号
  • ©:版权©
  • ™:商标

要求大家背过的特殊字符:

 、<、>、&copy

比如说,你想把<p>作为一个文本在页面上显示,直接写<p>是肯定不行的,因为这代表的是一个段落标签,所以这里需要用到转义字符。应该这么写:

这是一个HTML语言的&lt;p&gt;标签

效果显示:

如果还想知道其它的HTML特殊字符:HTML特殊字符参考表

百万年薪python之路 -- HTML标签的更多相关文章

  1. 百万年薪python之路 -- 前端CSS样式

    CSS样式 控制高度和宽度 width宽度 height高度 块级标签能设置高度和宽度,而内联标签不能设置高度和宽度,内联标签的高度宽度由标签内部的内容来决定. 示例: <!DOCTYPE ht ...

  2. 百万年薪python之路 -- 面向对象之继承

    面向对象之继承 1.什么是面向对象的继承 继承(英语:inheritance)是面向对象软件技术当中的一个概念. 通俗易懂的理解是:子承父业,合法继承家产 专业的理解是:子类可以完全使用父类的方法和属 ...

  3. 百万年薪python之路 -- re模块

    re模块 re模块是python用来描述正则表达式的一个模块. 正则表达式本身也和python没有什么关系,就是匹配字符串内容的一种规则. 官方定义:正则表达式是对字符串操作的一种逻辑公式,就是用事先 ...

  4. 百万年薪python之路 -- 数据库初始

    一. 数据库初始 1. 为什么要有数据库? ​ 先来一个场景: ​ 假设现在你已经是某大型互联网公司的高级程序员,让你写一个火车票购票系统,来hold住十一期间全国的购票需求,你怎么写? 由于在同一时 ...

  5. 百万年薪python之路 -- 并发编程之 协程

    协程 一. 协程的引入 本节的主题是基于单线程来实现并发,即只用一个主线程(很明显可利用的cpu只有一个)情况下实现并发,为此我们需要先回顾下并发的本质:切换+保存状态 cpu正在运行一个任务,会在两 ...

  6. 百万年薪python之路 -- RBAC角色权限设计

    RBAC(Role-Based Access Control,基于角色的访问控制),就是用户通过角色与权限进行关联.简单地说,一个用户拥有若干角色,每一个角色拥有若干权限.这样,就构造成"用 ...

  7. 百万年薪python之路 -- JS的BOM与DOM对象

    BOM对象 location对象 location.href 获取URL location.href="URL" // 跳转到指定页面 location.reload() 重新加载 ...

  8. 百万年薪python之路 -- JS基础介绍及数据类型

    JS代码的引入 方式1: <script> alert('兽人永不为奴!') </script> 方式2:外部文件引入 src属性值为js文件路径 <script src ...

  9. 百万年薪python之路 -- 前端CSS基础介绍

    一. CSS介绍 CSS定义 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 语法结构 div{ color: green ...

随机推荐

  1. [VB.NET Tips]Select Case语句拾遗

    正常的Select 语句如下: Dim status As Integer = 5 Select Case status Case 0 Console.WriteLine("状态是:0&qu ...

  2. thinkphp将上传的临时文件移动到指定目录

    thinkphp将上传的临时文件移动到指定目录 新建common.php文件 <?phpuse think\facade\Env; /** 移动上传的临时文件 * * @img_dir stri ...

  3. 在linux服务器上装svn版本管理,自动部署代码到web项目

    在linux服务器上装svn版本管理,自动部署代码到项目 1.安装svn服务器端  yum install subversion   从镜像下载安装svn服务器端 中间会提示是否ok,输入y,确认  ...

  4. vue报错:[Vue warn]: Do not use built-in or reserved HTML elements as component id: header

    报错的信息大致是不要将内置或保留的HTML元素用作组件ID 解决的办法是修改name符合规范或者直接删除组件内的name属性.

  5. .NET之Hangfire快速入门和使用

    前言: 定时任务调度问题,是一个老生常谈的问题.网上有许多定时任务调度的解决方案,对于我而言很早以前主要是使用Window计划和Window服务来做任务定时执行,然后就开始使用定时任务调度框架Quar ...

  6. 引用极光jar包之后出现控制台日志打印不出来的问题。解决!

    由于极光的jar包中引用的有log4j,项目本身也引用有log4j,如果版本有冲突,则会出现控制台日志记录打印不出来的现象.解决:引用极光jar包的时候,排除log4j. <dependency ...

  7. Flask基础(03)-->创建第一个Flask程序

    # 导入Flask from flask import Flask # 创建Flask的应用程序 # 参数__name__指的是Flask所对应的模块,其决定静态文件从哪个地方开始寻找 app = F ...

  8. 【转+】python为什么推荐使用多进程

    最近在看Python的多线程,经常我们会听到老手说:“Python下多线程是鸡肋,推荐使用多进程!”,但是为什么这么说呢?                要知其然,更要知其所以然.所以有了下面的深入研 ...

  9. Java文件操作——File

    创建File isFile().length().exists().createNewFile(). File.separator / isDirtory(). mkdir().mkdirs(). d ...

  10. Zygote家的大儿子 —— SystemServer

    本文基于 Android 9.0 , 代码仓库地址 : android_9.0.0_r45 文中源码链接: SystemServer.java SystemServiceManager.java Sy ...