8、HTML 区块与内联
<div>详解:
DIV标签,称为区隔标记。作用是设定字、画、表格等的摆放位置
当你把文字、图象,或其他的放在 DIV 中,它可称作为“DIV block”,或“DIV element”或“CSS-layer”,或干脆叫“layer”。而中文我们把它称作“层次”
DIV元素,是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素
DIV 属于块级元素,浏览器会在其前后显示折行
实例 --->
<body> <p>这是一些文本。</p> <div style="color:#0000FF"> <h3>这是一个在 div 元素中的标题。</h3> <p>这是一个在 div 元素中的文本。</p> </div> <p>这是一些文本。</p> </body>
<span>详解:
<span>在行内定义一个区域,也就是一行内可以被<span>划分成好几个区域,从而实现某种特定效果
<span>在CSS定义中属于一个行内元素,而<div>是块级元素,我们可能通俗地理解为<div>为大容器,大容器当然可以放一个小容器了,<span>就是小容器
当与 CSS 一同使用时,<span> 元素可用于为部分文本设置样式属性
实例 --->
<body> <p>
我的母亲有
<span style="color:blue;font-weight:bold">
蓝色
</span>
的眼睛,我得父亲有
<span style="color:darkolivegreen;font-weight:bold">
碧绿色
</span>
的眼睛。
</p> </body>
区块元素和内联元素
大多数 HTML 元素被定义为块级元素或内联元素。
块级元素在浏览器显示时,通常会以新行来开始(和结束)。
实例: <h1>, <p>, <ul>, <table>
内联元素在显示时通常不会以新行开始。
实例: <b>, <td>, <a>, <img>
框架集
1、<frameset></frameset> 框架集标签
rows=" 150, * " 建立上下两个框架,一个框架高度是150px,一个框架的高度是剩下的全部(150px以外)
cols=" 150, * " 建立左右两个框架,一个框架宽度是150px,一个框架的宽度是剩下的全部(150px以外)
2、<frame></frame> 子框架集标签 src="src.html" 源网页
noresize="noresize" 使子框架不能拖动边框,无法缩放
frameborder="0" 使子框架的边框为0
实例: <frameset rows="40%, 60%"> <frame> <frameset cols="50%, 50%"> <frame> <frame> </frameset> </frameset>
分为上下两个子框架
下面又嵌套了左右两个子框架
区块 与 内联
1、内联 ------》 块
在标签内添加:Display:block
2、块 ------》内联
在标签内添加:Display:inline-block
注意:块元素 Display:inline-block 包含块 和 内联元素
内联元素 Display:block 只能包含内联元素
内联元素又叫行内元素

浙公网安备 33010602011771号