您现在的位置是:首页 > 正文

行内元素与块级元素

2024-02-29 12:50:11阅读 0

一、行内元素与块级元素的三个区别

1.行内元素与块级元素直观上的区别

    行内元素会在一条直线上排列,都是同一行的,水平方向排列

    块级元素各占据一行,垂直方向排列。块级元素从新行开始结束接着一个断行。

2.块级元素可以包含行内元素和块级元素。行内元素不能包含块级元素。

3.行内元素与块级元素属性的不同,主要是盒模型属性上

行内元素设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效

二、行内元素转换为块级元素

        display:block (字面意思表现形式设为块级)

三、行内元素与块级元素

块级元素列表
<address> 定义地址
<caption> 定义表格标题
<dd> 定义列表中定义条目
<div> 定义文档中的分区或节
<dl> 定义列表
<dt> 定义列表中的项目
<fieldset> 定义一个框架集
<form> 创建 HTML 表单
<h1> 定义最大的标题
<h2> 定义副标题
<h3> 定义标题
<h4> 定义标题
<h5> 定义标题
<h6> 定义最小的标题
<hr> 创建一条水平线
<legend> 元素为 fieldset 元素定义标题
<li> 标签定义列表项目
<noframes> 为那些不支持框架的浏览器显示文本,于 frameset 元素内部
<noscript> 定义在脚本未被执行时的替代内容
<ol> 定义有序列表
<ul> 定义无序列表
<p> 标签定义段落
<pre> 定义预格式化的文本
<table> 标签定义 HTML 表格
<tbody> 标签表格主体(正文)
<td> 表格中的标准单元格
<tfoot> 定义表格的页脚(脚注或表注)
<th> 定义表头单元格
<thead> 标签定义表格的表头
<tr> 定义表格中的行
行内元素列表
<a> 标签可定义锚
<abbr> 表示一个缩写形式
<acronym> 定义只取首字母缩写
<b> 字体加粗
<bdo> 可覆盖默认的文本方向
<big> 大号字体加粗
<br> 换行
<cite> 引用进行定义
<code> 定义计算机代码文本
<dfn> 定义一个定义项目
<em> 定义为强调的内容
<i> 斜体文本效果
<img> 向网页中嵌入一幅图像
<input> 输入框
<kbd> 定义键盘文本
<label> 标签为 input 元素定义标注(标记)
<q> 定义短的引用
<samp> 定义样本文本
<select> 创建单选或多选菜单
<small> 呈现小号字体效果
<span> 组合文档中的行内元素
<strong> 语气更强的强调的内容
<sub> 定义下标文本
<sup> 定义上标文本
<textarea> 多行的文本输入控件
<tt> 打字机或者等宽的文本效果
<var> 定义变量
可变元素列表--可变元素为根据上下文语境决定该元素为块元素或者内联元素
<button> 按钮
<del> 定义文档中已被删除的文本
<iframe> 创建包含另外一个文档的内联框架(即行内框架)
<ins> 标签定义已经被插入文档中的文本
<map> 客户端图像映射(即热区)
<object> object对象
<script> 客户端脚本

网站文章

  • 中南大学2020计算机研究生报录比,近2.2万人报考,中南大学2020考研报录比数据统计,最高33:1...

    中南大学2020计算机研究生报录比,近2.2万人报考,中南大学2020考研报录比数据统计,最高33:1...

    原标题:近2.2万人报考,中南大学2020考研报录比数据统计,最高33:1 中南大学是坐落在湖南长沙的一所985高校,历年考研报考人数也较多。今天我们来详细看看中南大学各个专业考研报录情况。2020...

    2024-02-29 12:50:02
  • 如何使用U盘替换光驱引导部署WES7系统

    如何使用U盘替换光驱引导部署WES7系统

    作者:Joseph-Growth转自:http://blog.csdn.net/joseph_happy/article/details/7679643版权声明:本文为博主原创文章,未经博主允许不得转载。目录(?)[+]前言在部署WES7系统过程中,有时为了验证某个特性,需要经常根据不同定制的配置文件来安装WES7系统。最简单的方式往往都是从光驱

    2024-02-29 12:49:56
  • java.util.ConcurrentModificationException

    需求: 在一组列表中,如果符合条件,将标志为true,否则为falsepublic static void main(String args[]) { HashMap map = new HashMap(); map.put("0", "1"); map.put("1", "x"); map.put("2", "x"); Iterator i = map.keyS

    2024-02-29 12:49:27
  • nginx location的正则匹配规则

    nginx location的正则匹配规则 location匹配命令 ~ #波浪线表示执行一个正则匹配,区分大小写 ~* #表示执行一个正则匹配,不区分大小写 ^~ #^~表示普通字符匹配,如果该选项匹配,则不再匹配别的选项,一般用来匹配目录,普通匹配 = #进行普通字符精确匹配,精确匹配后不会再继续任何别的匹配了,普通匹配 @ #

    2024-02-29 12:49:19
  • 文件系统:逻辑结构

    文件系统 文件的逻辑结构(File Logical Structure) 从用户观点出发所观察到的文件组织形式,是用户可以直接处理的数据及其结构,它独立于文件的物理特性,又称为文件组织(File Or...

    2024-02-29 12:49:11
  • Java 每半年就会更新一次新特性,再不掌握就要落伍了:Java11 的新特性

    从 2017 年开始,Java 版本更新策略从原来的每两年一个新版本,改为每六个月一个新版本,以快速验证新特性,推动 Java 的发展。从 《JVM Ecosystem Report 2021》 中可...

    2024-02-29 12:48:41
  • 【爬虫笔记】关于Beautiful Soup 4

    【爬虫笔记】关于Beautiful Soup 4

    再使用BeautifulSoup 4时遇到了一些问题,找到了解决方法,通过本博文将遇到的问题和解决方法记录下来,方便回顾也希望能帮助大家解决类似问题。

    2024-02-29 12:48:34
  • Integer类型和int类型相等的值是否相等? - Java

    Integer类型和int类型相等的值是否相等? - Java

    概要 java当中,对于&quot;==&quot;符号肯定不陌生,总的来讲:==比较的是值是否相等 相关文章:Java中==与equals()方法的区别 基本数据类型:数值大小是否相等 引用数据类型...

    2024-02-29 12:48:29
  • 设计模式(二十一):行为型之访问者模式

    设计模式(二十一):行为型之访问者模式

    定义封装一些作用于某种数据结构中的各元素的操作它可以在不改变这个数据结构的前提下定义作用于这些元素的新的操作。

    2024-02-29 12:47:58
  • mysql从库需要先建表吗_Mysql 建库 建表 插入数据

    mysql从库需要先建表吗_Mysql 建库 建表 插入数据

    //查看所有数据库show databases;//新建Test数据库,建议不要用中文或者关键字,如果一定要用的化可以加反引号``引起来 charset 分为utf8 /gbkcreate datab...

    2024-02-29 12:47:52