块级元素与行内元素区别

原文链接: https://www.mk2048.com/blog/blog.php?id=h01c2a0c0i0j&title=%E5%9D%97%E7%BA%A7%E5%85%83%E7%B4%A0%E4%B8%8E%E8%A1%8C%E5%86%85%E5%85%83%E7%B4%A0%E5%8C%BA%E5%88%AB

块级元素与行内元素

1.块级元素:

特性:占一行显示,可以设置宽度和高度

属性                           描述

<address>                 地址

<blockquote>            长的引用

<caption>                  表格标题

<dd>                         列表中定义条目                  

<div>                        划分区域

<dl>                          定义列表

<dt>                          列表中项目

<fieldset>                 框架集

<form>                     表单

<h1>-<h6>               标题(一级到六级)

<hr>                          一条水平线                 

<legend>                  为fieldset元素定义标题

<li>                           列表

<noframes>             给不支持框架的浏览器显示文本,frameset元素内部

<noscript>               在脚本未被执行时的替代内容

<ol>                        有序列表

<p>                         段落

<pre>                     预格式化文本

<table>                  表格

<tbody>                 表格主体

<td>                      标准单元格

<tfoot>                  表格页脚

<th>                      表头单元格

<thead>                表头

<tr>                      表格的行

<ul>                     无序列表

2.行内元素:

特性:可以在一行并排显示

属性                        描述

<a>                        超链接,定义锚

<abbr>                   缩写

<acronym>            只取首字母缩写

<b>                        字体加粗

<bdo>                    默认的文本方向

<big>                    大号字体加粗

<br>                     换行            

<cite>                   引用进行定义

<code>                代码文本

<dfn>                  一个定义项目

<em>                  定义为强调的内容

<i>                      斜体

<img>                 图片

<input>               输入框

<kbd>                键盘文本

<label>              表单控件

<q>                    短引用

<samp>             样本文本

<select>            单选或多选菜单

<small>             小号字体效果

<span>             组合文档中行内元素

<strong>           调调的内容

<sub>               下标文本

<sup>               上标文本

<textarea>        多行文本输入控件

<tt>                    打字机或者等宽文本效果

<var>                 变量

3.元素/内联元素:

特性:根据兄弟元素决定

属性                       描述

<button>                按钮

<del>                     定义已被删除的文本

<iframe>                创建另外一个文档的行内框架

<ins>                     定义已被插入文档中的文本

<map>                   客户端图像映射

<object>                object对象

<script>                 客户端脚本

4.可以改变显示方式

属性                                   描述

display: block;                   块级元素

display: inline;                  行内元素

display: inline-block;        行内块

display: none;                  不显示该元素,释放其占用位置

5.其他

<base target="_blank"/>:写在<head>标签中,可以使网页的<a>标签全部都执行target属性,若不希望在空白页打开,可以在<a>标签中写<a target="_self"> 属性


更多专业前端知识,请上 【猿2048】www.mk2048.com

猜你喜欢

转载自blog.csdn.net/whiteGay/article/details/102740097