html元素可以分为三大类:顶级、块级、行级(内联)
1. Top-level element 【顶级元素】: { html, body, frameset }
属于高级块级元素.
2. Block-level element 【块级元素】: { p, h1~h6, div, ul,li }
以块显示的元素,高度宽度都是可以设置的。
块级元素比较霸道,默认状态下每次都占据一整个行,前后的内容也必须再新起一行显示。
块级元素也能变成行级元素,那就是通过css的display:inline;和float来实现。
3. Inline element 【内联元素】: { a, br, em, img, li, span }
通俗点来说就是文本的显示方式,内联元素的高度宽度是不可以设置的,其宽度和高度就是根据自身文字或者图片的宽度延展得来。
内联元素的显示特点就是像文本一样的显示,不会独自占据一个行。
行级元素可以通过css的display:block和float属性更改成块级元素
block元素的特点
1、元素前后都要换行
2、高度,行高以及外边界和内边距都可控制
3、宽度缺省是它的容器的100%,除非设定一个宽度。
4、它可以容纳内联元素和其他块元素
inline元素的特点
1、和其他行内元素都在一行上;
2、高,行高及上下外边界不可改变;(左右边界、内边距都可以改)
3、宽度就是它的文字或图片的宽度,不可改变
4、内联元素只能容纳文本或者其他内联元素
行内元素与块级元素有什么不同?
width / heigh
行级元素设置宽高无效,它的宽高仅会因内容的大小和多少而延展
块级元素可以任意设置宽高
padding / margin
行级元素的内边距和外边界左右设置有效,但是上下边界无效
块级元素是构成一个html的主要和关键元素, 而任意一个块级元素均可以用盒子模型来说明.
span{
line-height:2;
font-size:40px;
background:red;
padding:1px 50px;
margin:10px;
width:1000px;
height:200px;
}
<div>
<span>ez编程网ez编程网ez编程网ez编程网ez编程网ez编程网ez编程网</span>
<span>ez编程网ez编程网ez编程网ez编程网ez编程网ez编程网ez</span>
<span>编程网ez编程网ez编程网ez编程网</span>
</div>
常见块元素(block element)
◎ address - 地址
◎ blockquote - 块引用
◎ center - 居中对齐块
◎ dir - 目录列表
◎ div - 常用块级容器,也是css layout的主要标签
◎ dl - 定义列表
◎ fieldset - form控制组
◎ form - 交互表单
◎ h1 - 大标题
◎ h2 - 副标题
◎ h3 - 3级标题
◎ h4 - 4级标题
◎ h5 - 5级标题
◎ h6 - 6级标题
◎ hr - 水平分隔线
◎ isindex - input prompt
◎ menu - 菜单列表
◎ noframes - frames可选内容,(对于不支持frame的浏览器显示此区块内容)
◎ noscript - 可选脚本内容(对于不支持script的浏览器显示此内容)
◎ ol - 排序表单
◎ p - 段落
◎ pre - 格式化文本
◎ table - 表格
◎ ul - 非排序列表(无序列表)
常见内联元素(inline element)
◎ a - 锚点
◎ abbr - 缩写
◎ acronym - 首字
◎ b - 粗体(不推荐)
◎ bdo - bidi override
◎ big - 大字体
◎ br - 换行
◎ cite - 引用
◎ code - 计算机代码(在引用源码的时候需要)
◎ dfn - 定义字段
◎ em - 强调
◎ font - 字体设定(不推荐)
◎ i - 斜体
◎ img - 图片
◎ input - 输入框
◎ kbd - 定义键盘文本
◎ label - 表格标签
◎ q - 短引用
◎ s - 中划线(不推荐)
◎ samp - 定义范例计算机代码
◎ select - 项目选择
◎ small - 小字体文本
◎ span - 常用内联容器,定义文本内区块
◎strike - 中划线
◎ strong - 粗体强调
◎ sub - 下标
◎ sup - 上标
◎ textarea - 多行文本输入框
◎ tt - 电传文本
◎ u - 下划线
◎ var - 定义变量
相关推荐
• sample08.htm 使用外部脚本文件和嵌入的JavaScript代码 • sample09.htm 边加载边解析的JavaScript代码 • sample10.htm 先加载后解析的JavaScript代码 • sample11.htm 单行注释语句 • sample12.htm 多行注释...
9. **区块元素与内联元素**:区块元素如`<div>`会占据一整块区域,内联元素如`<span>`只占据自身内容的宽度。 10. **样式控制**:虽然HTML主要关注结构,但可以通过`<style>`标签或`<link>`引入外部CSS文件来添加...
介绍一下行内元素和块级元素,这个很重要,因为有的属性只能用于块元素,而有的正好相反,在一定的情况下,它们也可以相互转换,比如用display来进行设置。 行内元素(又叫内联元素inline element): ①不占据一整行...
可能在`index.html`中包含了HTML结构和内联的CSS与JavaScript,而`说明.htm`和`说明.txt`则提供了关于如何使用这个特效的详细说明和指导。 总的来说,这个压缩包中的特效展示了CSS3的强大功能,尤其是3D变换和动画...
"HTML点击方块得分小游戏"文件很可能是游戏的主文件,包含了HTML、CSS和JavaScript代码的组合,可能使用了内联样式或外部样式表,以及内联脚本或外部脚本文件。 这个小游戏展示了Web开发的基本原理,同时体现了...
`index.htm`很可能是项目的主要入口文件,包含了HTML结构和内联JavaScript,而`说明.htm`可能提供了关于如何使用或理解该项目的详细信息。 总之,"疯狂攻击鼠标"这个项目展示了JavaScript在创建互动网页特效方面的...
HTML元素可以分为三类:块级元素、内联元素和行内块元素,它们决定了元素在页面上的显示方式。 1. 块级元素:如`<div>`、`<p>`、`<h1>`-`<h6>`,它们会在页面上占据整行,并且默认情况下,新的块级元素会另起一行...
CSS的“层叠”特性意味着样式可以来自多个源,如外部样式表、内部样式块和内联样式。样式冲突时,根据权重决定最终应用的样式,权重越高,优先级越大。权重由选择器类型决定,ID选择器权重最高,类、属性和伪类次之...
在提供的压缩包中,`index.html`是游戏的主要页面,包含了HTML结构和可能的内联CSS及JavaScript。`说明.htm`或`说明.txt`文件可能包含了游戏的使用说明或者开发者注释,解释了代码的工作原理和如何运行游戏。 要...
3. **绝对定位**:元素脱离文档流,相对于最近的已定位祖先元素(如果没有,则相对于初始包含块)定位。 4. **固定定位**:元素相对于浏览器窗口定位,即使页面滚动,元素位置不变。 5. **Flexbox**和**Grid**布局...
内联元素如`<span>`、`<a>`和`<strong>`只占据自身内容的宽度,可以在同一行内排列。 9. **表格标签(Table Tags):** `<table>`用于创建表格,`<tr>`定义行,`<td>`定义单元格,`<th>`定义表头单元格。 10. **...
12. **块级元素与内联元素**:`<h1>`、`<p>`和`<div>`是块级元素,而`<span>`是内联元素,不适用于块状属性。正确答案是`(B)`。 13. **框架集**:`<frameset>`标签用于创建框架布局,`cols`属性定义列,`rows`属性...
在压缩包中的"发一个弹性菜单,垂直的那种.htm"文件很可能是示例代码,它可能包含HTML结构、内联CSS和JavaScript代码。HTML可能定义了菜单的DOM元素,CSS为这些元素提供了初始样式,而JavaScript部分则通过添加事件...
- `<span>`是内联标签,不适用于块状元素属性,`(B)`错误。 13. HTML框架: - `<frameset>`标签用于创建框架布局,题目中展示了两层嵌套的框架集,分别用于行和列布局。具体分析不在题目范围内,但可以确定代码...
1. `index.htm`:这是网页的主入口文件,通常包含HTML结构,定义了页面的基本元素和框架,可能还包括内联CSS和JavaScript代码。 2. `html5中文网- HTML5资源分享平台.url`:这可能是一个快捷方式链接,指向一个HTML5...
根据W3c,我们不应该在内联元素中创建块级元素 )。 图片出现错误 onerror =“ this.onerror = null; this.src =' ://placeimg.com/200/300/animals';” 跨原点属性 <iframe src =“ demo_iframe_sandbox_form....
dk.htm、说明.htm、daikuan.htm可能是HTML文件,其中可能包含了内联JavaScript代码或引用了外部JS文件。下载说明.txt可能是关于如何使用这些文件的指南,而daikuan可能是一个JavaScript文件,包含了实际的代码示例。...
【压缩包子文件的文件名称列表】只有一个文件:game.htm,这通常是一个HTML文件,其中包含了游戏的HTML结构以及内联的JavaScript代码。在这个文件中,开发者可能使用了HTML5的canvas元素或者DOM操作来绘制游戏画面,...