- 浏览: 166493 次
- 性别:
- 来自: 南京
文章分类
- 全部博客 (327)
- JAVA (130)
- 工作笔记 (49)
- SQLSERVER (5)
- ORACLE (28)
- nginx (1)
- Unix C (16)
- 系统 (19)
- 网络技术 (17)
- WEB前端 (22)
- Eclipse (2)
- Tomcat (1)
- spring (7)
- MYSQL (12)
- Maven (6)
- JETTY (2)
- 设计 (2)
- 开源项目 (7)
- asterisk (0)
- C++ (2)
- WINDOWS (2)
- SCALA (0)
- 协议 (1)
- Netty (1)
- SHELL (1)
- mybaits (4)
- 并发 (2)
- 架构 (2)
- TCP/IP (8)
- 虚拟化 (3)
- 不要再说java慢 (0)
- mac (2)
- mysql乱码完美解决 (1)
最新评论
以图例来表述行内元素和块级元素的区别会更加直观:
注:行内元素会再一条直线上,是在同一行的。SPAN strong
注:块级元素各占一行。是垂直方向的!
div标签
P标签
如果你要将行内元素变成块级元素,那么就只需要在该标签上加上样式 display:block; 这里已经牵涉到了CSS内容。块级元素可以用样式控制其高、宽的值。
行内元素不可以控制宽和高,除非你想将它转变成为块级元素。它的宽和高,是随标签里的内容而变化。
块级元素列表
<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> 客户端脚本
注:行内元素会再一条直线上,是在同一行的。SPAN strong
注:块级元素各占一行。是垂直方向的!
div标签
P标签
如果你要将行内元素变成块级元素,那么就只需要在该标签上加上样式 display:block; 这里已经牵涉到了CSS内容。块级元素可以用样式控制其高、宽的值。
行内元素不可以控制宽和高,除非你想将它转变成为块级元素。它的宽和高,是随标签里的内容而变化。
块级元素列表
<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> 客户端脚本
发表评论
-
奇怪的事情
2015-03-14 18:50 506我百度查了某东西之后,我看什么都会贴上下面这玩意。 ... -
HTML 字符实体 < >: &等
2014-11-12 08:38 890http://lidongbest5.com/blog/5/ -
v8 引擎相关
2014-10-27 07:22 464http://blog.csdn.net/horkychen/ ... -
Zen Coding: 一种快速编写HTML/CSS代码的方法
2014-10-12 21:07 354Zen Coding: 一种快速编写HTML/CSS代码的方法 ... -
ajax 三种提交请求的方法
2014-09-25 22:31 433http://blueskator.iteye.com/blo ... -
浏览器静态资源的版本控制新思路.强制更新指定资源缓存.的探讨
2014-09-11 17:59 412http://www.cnblogs.com/_franky/ ... -
日历插件
2014-08-07 10:35 371日历插件 http://www.open-open.com/n ... -
关于前端优化的争论
2014-04-12 22:10 385【院士】广州-simon 2014/4/12 21:19:37 ... -
vs2008 js 调试厉器
2014-03-31 15:27 409vs2008 js 调试厉器 http://javadevil ... -
velocity + spring mvc
2014-03-29 12:57 362http://m.blog.csdn.net/blog/sus ... -
格式化 压缩后的JS
2013-11-16 22:45 394http://blog.csdn.net/yenange/ar ... -
闭包的概念和developer.mozilla.org的文档
2013-10-09 22:51 478http://www.jb51.net/article/241 ... -
CSS:background-position
2013-10-03 16:19 342转自http://blog.csdn.net/JeamKing ... -
JAVASCRIPTS
2013-09-30 16:58 326http://www.cnblogs.com/TomXu/ar ... -
语义化HTML标签
2013-09-30 15:53 374语义化HTML标签 一个 ... -
innerHTML innerText out
2013-09-30 11:09 555js中 innerHTML与innerText的用法与区别及解 ... -
cookie
2013-09-04 21:26 673http://www.jb51.net/article/145 ... -
[转载] Web前端浏览器兼容初探
2013-08-22 10:12 690http://www.cnblogs.com/yexiaoch ... -
CSS 盒模型
2013-08-19 23:16 683http://www.cnblogs.com/yingzi/a ... -
(转)DocType 的严格模式与混杂模式
2013-08-19 23:03 353严格模式与混杂模式——如何触发这两种模式,区分它们有何意义。 ...
相关推荐
可以将行内元素转换为行内块元素。 此外,设置 float 属性也可以使行内元素转换为块级元素,并拥有浮动特性。设置 position 属性也可以使行内元素转换为块级元素,但这只是副作用,它们的主要作用是干扰布局效果。...
它们可以设置宽度、高度、内边距以及外边距,但依然保持在文本流中与其他行内元素相邻。然而,当尝试通过调整行高来使这些元素垂直居中时,我们可能会发现效果并不如预期。 首先,行高(line-height)主要应用于...
块元素是指占据一整行空间的元素,而行内元素是指只占据所需空间的元素。下面我们将对块元素和行内元素进行详细的介绍。 块元素(block element) 块元素是指占据一整行空间的元素。块元素通常具有以下特点: * ...
4. **嵌套兼容性**:块级元素可以包含其他块级元素或行内元素,但行内元素不能包含块级元素。 常见的块级元素包括但不限于: - `<address>`:用于定义文档或文章的联系信息。 - `<center>`:虽然HTML5不推荐使用,...
块元素默认独占一行,它们通常会被视为一个独立的容器,其中可以包含其他行内元素或块元素。块元素的宽度默认扩展到父元素的宽度,除非通过CSS进行显式设置。以下是一些典型的块元素: - **`address`** - 用于定义...
元素按照显示方式主要可以分为块级元素和行内元素,元素的显示方式由display属性控制。 块级元素特点总结: 1、总是在新行上开始 2、宽度的默认为width+margin-left+margin-right+padding-left+padding-right刚好...
将display设为`inline`可以使块级元素变为行内元素,而设为`block`则可使行内元素变为块级元素。此外,还有`inline-block`值,它结合了两者特性,元素像块级元素一样可以设置宽高和margin,但仍然可以与其他元素并列...
**控制块级元素与行内元素的方法**: - 通过改变`display`属性来转换元素类型。例如,可以将一个行内元素转换为块级元素,或者反之亦然。 - 使用`float`属性可以让块级元素像行内元素那样显示在同一行,而使用`clear...
例如,可以使用 `display` 属性将块元素 `<div>` 转换为行内元素,或者将行内元素 `<strong>` 转换为块元素。 转换块元素为行内元素: ```css div { display: inline; } ``` 转换行内元素为块元素: ```css ...
块级元素会独占一行,而行内元素则会根据可用空间在行内排列。浮动元素会脱离正常文档流,移到一行的一侧,如果当前行空间不足,则会换行。内联元素不会单独占据一行。 浮动(float)是一种让元素在页面中浮动的...
此外,`display: inline-block`还可以创建一种“行内块级元素”,它结合了行内元素和块级元素的特性,可以在一行内显示,同时可以设置宽高和内外边距。 5. **总结** CSS中的行内元素和块级元素是网页布局的基础,...
行内元素,如`a`、`em`和`strong`,它们不会占据整行,其宽度由内容决定,高度通常基于字体大小,不能直接设置宽高。然而,通过修改`display`属性,可以将元素从一种类型转换为另一种类型。例如,将`display`设为`...
前端日记01_行内元素和块级元素欢迎大家来跟胖胖一起xio习!基本知识分类速览块级元素和行级元素的转换参考链接 欢迎大家来跟胖胖一起xio习! Hey,这里是胖胖的博客,目前正在学有关前端的知识,有时候会把一些遇到...
4. 包含关系不同:块级元素可以包含行内元素和其他块级元素,但行内元素不能包含块级元素,只能包含文本或其它行内元素。 掌握行内元素与块级元素的区别对于网页布局和样式设计至关重要。它们的不同特性和行为会...
在CSS3中,实现块元素的居中是一个常见的布局需求,尤其当涉及到页面设计与响应式布局时。根据所提供的文件信息,我们可以详细探讨几种在不同场景下实现块元素居中的方法,以及理解其中的原理。 ### 1. 内联元素...
在提到的"行内元素"和"块级元素"中,`display:inline-block`是一种混合型显示模式,它允许元素保持行内元素的特性(如并排排列),同时具有块级元素的一些优点,比如可以设置宽度和高度。然而,在IE6这个古老版本的...
例如,将一个块元素的`display`属性设置为`inline`,可以使其表现得像行内元素;反之,将行内元素的`display`属性设为`block`,它就会变成块元素的行为。`inline-block`值允许元素既保持行内元素的特性,又能够设置...
一、块级元素 行内元素 div、h1 或 p 元素常常被称为块级元素。这意味着这些元素显示为一块内容,即“块框”。与之相反,span 和 strong 等元素称为“行内元素”,这是因为它们的内容显示在行中,即“行内框”。 您...