前端基础知识回顾——行内元素与块级元素

Posted 清颖~

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了前端基础知识回顾——行内元素与块级元素相关的知识,希望对你有一定的参考价值。

本文之前一直在草稿箱的,还是发布一下吧~
基础知识回顾:
默认情况下,行内元素不会以新行开始,而块级元素会新起一行。
一般情况下,行内元素只能包含(数据和其他行内元素);而块级元素可以包含(行内元素和其他块级元素)。

1. 行内元素:

下面的元素都是行内元素:

<a>,<span>,<br/>,<img/>,
<b>,<strong>,<em>,<mark>,
<label>,<textarea/>,
<button/>,<select>,<input/>,
<big>,<small>,
<del>

b, big, i, small, tt
abbr, acronym, cite, code, dfn, em, kbd, strong, samp, var
a, bdo, br, img, map, object, q, script, span, sub, sup
button, input, label, select, textarea

壮strong
em一亩
mark马克
删除线

不要将<b>元素与 <strong>、<em>或<mark>元素混淆。 
<strong>元素表示某些重要性的文本,
<em>强调文本,
而<mark>元素表示某些相关性的文本。
 <b>元素不传达这样的特殊语义信息;仅在没有其他合适的元素时使用它。

2.块级元素

<address>联系方式信息。
<article> html5
文章内容。
<aside> HTML5
伴随内容。
<audio> HTML5
音频播放。
<blockquote>
块引用。
<canvas> HTML5
绘制图形。
<dd>
定义列表中定义条目描述。
<div>
文档分区。
<dl>
定义列表。
<fieldset>
表单元素分组。
<figcaption> HTML5
图文信息组标题
<figure> HTML5
图文信息组 (参照 <figcaption>)。
<footer> HTML5
区段尾或页尾。
<form>
表单。
<h1> (en-US), <h2> (en-US), <h3> (en-US), <h4> (en-US), <h5> (en-US), <h6> (en-US)
标题级别 1-6.
<header> HTML5
区段头或页头。
<hgroup> HTML5
标题组。
<hr>
水平分割线。

<noscript>
不支持脚本或禁用脚本时显示的内容。
<ol>
有序列表。
<output> HTML5
表单输出。
<p>
行。
<pre>
预格式化文本。
<section> HTML5
一个页面区段。
<table>
表格。
<tfoot>
表脚注。
<ul>
无序列表。
<video> 
视频

以上是关于前端基础知识回顾——行内元素与块级元素的主要内容,如果未能解决你的问题,请参考以下文章

行内元素与块级元素的区别,行内块级元素在IE8-的兼容性

行,行内元素与块级元素有什么不同?

行内元素与块级元素的特点及区别

行内元素与块级元素

行内元素(内联元素)与块级元素

块级元素和行内元素区别