美文网首页
html中内联元素和块级元素的区别

html中内联元素和块级元素的区别

作者: 北冥有鱼我养的 | 来源:发表于2019-05-28 11:40 被阅读0次

1.下表列出了内联元素和块级元素的主要区别

html中内联元素和块级元素的区别
块级元素 行内元素
独占一行,默认情况下,其宽度自动填满其父元素宽度 相邻的行内元素会排列在同一行里,直到一行排不下,才会换行,其宽度随元素的内容而变化
可以设置width,height属性 行内元素设置width,height属性无效
可以设置margin和padding属性 行内元素起边距作用的只有margin-left、margin-right、padding-left、padding-right,其它属性不会起边距效果。
对应于display:block 对应于display:inline;
2.按字母顺序排列块级元素主要有

<address> 定义地址
<caption> 定义表格标题
<dd> 定义列表中定义条目
<div> 定义文档中的分区或节
<dl> 定义列表
<dt> 定义列表中的项目
<fieldset> 定义一个框架集
<form> 创建表单元素
<h1><h2><h3><h4><h5><h6> 标题元素


水平线
<legend> 给fieldset元素定义标题
<li> 定义列表项目
<noframes> 为那些不支持框架的浏览器显示文本,放置于frameset标签内
<noscript> 为那些不支持脚本的浏览器显示文本
<ol> 有序列表
<ul> 无序列表
<p> 定义段落
<pre> 定义预格式化文本
<table> 定义表格
<tbody> 定义表格主体
<td> 表格中的标准单元格
<tr> 表格中的行
<tfoot> 表格中的页脚
<th> 定义表头单元格
<thead> 定义表格的表头

3.内联元素有

<a> 可定义锚以及超链接
<abbr> 表示一个缩写形式
<acronym> 表示只取title中首字母的缩写形式
<b> 字体加粗
<bdo> 可覆盖默认的文本方向
<big> 大号字体加粗

换行
<cite> 引用进行定义
<code> 定义计算机代码文本
<dfn> 定义一个定义项目
<em> 定义为强调的内容
<i> 斜体文本效果
<img> 向网页中嵌入一张图像
<input> 输入框
<kbd> 定义键盘文本
<label> 为input进行标记/标注
<q> 定义短的引用

<s> 表示不准确不相关,却不应当给予删除的内容

<samp> 定义样本文本

<select> 定义单选或者多选菜单
<small> 呈现小号字体效果
<span> 组合文档中的行内元素
<strong> 语气更强的强调内容
定义下标文本
定义上标文本
<textarea> 多行文本输入控件
<tt> 打字机或者等宽的文本效果
<var> 定义变量

<input>和<img>都是行内元素,但是它们是可以设置宽和高的。这里就涉及到可替换元素和不可替换元素。

替换元素就是浏览器根据元素的标签和属性,来决定元素的具体显示内容。

例如浏览器会根据<img>标签的src属性的值来读取图片信息并显示出来,而如果查看html代码,则看不到图片的实际内容;又例如根据<input>标签的type属性来决定是显示输入框,还是单选按钮等。 html中的<img>、<input>、<textarea>、<select>、<object>都是替换元素。这些元素往往没有实际的内容,即是一个空元素,例如: <img src=”cat.jpg” /> <input type="submit" name="submit" value="提交" /> 浏览器会根据元素的标签类型和属性来显示这些元素。可替换元素也在其显示中生成了框。

不可替换元素 html 的大多数元素是不可替换元素,即其内容直接表现给用户端(例如浏览器)。

例如: <p>段落的内容</p> 段落<p>是一个不可替换元素,文字“段落的内容”全被显示。

相关文章

  • html中内联元素和块级元素的区别

    1.下表列出了内联元素和块级元素的主要区别 html中内联元素和块级元素的区别块级元素 行内元素独占一行,默...

  • 什么是块级元素和内联元素?

    1.下表列出了内联元素和块级元素的主要区别 html中内联元素和块级元素的区别 元素特点 2.按字母顺序排列块级元...

  • HTML中的块级元素与内联元素——零基础自学网页制作

    块级元素与内联元素的概念与区别 在HTML中,大多数元素都被定义为块级元素或内联元素。 块级元素通常会独立成行,而...

  • CSS布局(inline和block)

    CSS内联元素和块级元素, 内联块级元素 HTML语言标签元素被分为三种类型: 内联元素(行内元素), 块级元素,...

  • HTML总结

    块级元素和内联元素 在HTML中有两种你需要知道的重要元素类别,块级元素和内联元素。 块级元素在页面中以块的形式展...

  • HTML学习笔记

    块级元素和内联元素 在HTML中有两种你需要知道的重要元素类别,块级元素和内联元素。 块级元素在页面中以块的形式展...

  • DIV+CSS布局

    一、div和span区别 块元素与内联元素区别 块元素又称块级元素(block element)和其对应的是内联元...

  • 03|流,元素与基本尺寸

    01|块级元素 在HTML中标签众多,但是通常分为两类:"块级元素" 和 "内联元素" 01|块级元素 块级元素中...

  • HTML常用标签介绍

    html中标签有很多,主要分为三组,分别是块级元素、内联元素、内联块级元素。 块级元素 常见的块级元素有 ~ 、 ...

  • 【学习笔记】CSS权威指南

    块元素: 、 、 、 、 (特立独行)内联元素: 、 、 、 (随波逐流)在html和xhtml规范中,块级元...

网友评论

      本文标题:html中内联元素和块级元素的区别

      本文链接:https://www.haomeiwen.com/subject/ixbrtctx.html