前端学习（142）：行级标签和块级标签

2024-05-24 01:24:42

块级标签：(block)

1、独占一行，不和其他元素待在同一行，宽度自动填满父元素宽度

2、能设置weight(宽)、height(高)属性

3、可以设置margin，padding属性

常见的块级标签：

<address>，定义地址

<caption>，定义表格标题

<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>，定义表格中的行

列表(ul,ol,li)，盒子(div)，段落(p)，

表单(form),

表格(table,tr,td)，水平线(<hr>)

行级标签：(inline)

1、能和其他元素待在同一行

2、不能设置宽高

3、行内元素的水平方向的padding-left和padding-right都会产生边距效果，但是竖直方向上的padding-top和padding-bottom都不会产生边距效果

常见的行级标签：

<a>，超链接，

<abbr>，表示一个缩写形式

<acronym>，定义只取首字母缩写

<strong>/<b>，字体加粗

<em>,定义为强调的内容

<i>，斜体文本效果

<u>，下划线

<del>，删除线

<bdo>，可覆盖默认的文本方向

<big>，大号字体加粗

<br>，换行

<cite>，引用进行定义

<code>，定义计算机代码文本

<dfn>，定义了一个定义项目

<img>，向网页中嵌入一幅图像

<input>，输入框

<kbd>，定义键盘文本

<label>，标签为<input>元素定义标注(标记)

<q>，定义短的引用

<samp>，定义样本文本

<select>创建单选或多选菜单

<small>，呈现小号字体效果

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

<sub>，定义下标文本

<sup>，定义上标文本

<textarea>，多行的文本输入控件(文本域)

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

<var>，定义变量

行内块标签：(inline-block)

1、能和其他元素待在一行

2、能设置宽高

常见的行内块标签：

图片(<img>)，输入(<input>)，文本域(<textarea>)

前端学习（142）：行级标签和块级标签相关推荐

HTML学习笔记-----行内元素、块级元素和行内块元素
如图所示,a标签.i标签和span标签都是行内元素,p和h1标签都是块级元素,img则是行内块元素. 块级元素一般来讲,块级元素总会占据一行的空间,也就是说写在块级元素后面的内容会自动换行,另起一行 ...
行内块元素有哪些标签_html的行内元素与块级元素总结
希望大家补充一下常见的块级元素与行内元素~ 如有错误,请大家在评论区指出,一起进步! 一.区别二.常见的块级元素: p:段落标签 div:把DIV看作是一容器,容器专门用来包含内容 h1.h2- - ...
html5行级标签,8、html5哪些标签时块级、行内、行内块？2021-01-30
一.块级标签 div.p.h1-h6.form.ul.ol.dl.dt.dd.li.table.tr.td.th.hr.blockquote.address.table.menu.pre HTML5: ...
请写出至少五个块级元素_html 行级元素和块级元素标签列表分别有哪些
展开全部行内元素列表: 标签可定义锚表示一个缩写形式定义只取e5a48de588b662616964757a686964616f31333366303766首字母缩写字体加粗可覆盖默认的文本 ...
html 图片行内剧中,HTML入门(转义字符、行内样式和块级元素、定位、锚点、跑马灯标签、图片标签、表格标签的讲解)...
一.转义字符由特殊字符包裹的文本会当做标签去解析对应不换行空格对应全角空格 em是字体排印学的计量单位,相当于当前指定的点数.其占据的宽度正好是1个中文宽度,而且基本上不受字体影响. < ...
img标签和p标签是行内元素还是块级元素？以及p标签中可以放img标签吗？
img标签:行内块元素.类似于 inline-block 可以被p标签包裹.<p><img src="1.jpg"></p> 比如p是居中,图片 ...
HTML基础-标签分类(闭合标签，空标签，块级元素，行内元素，行级块元素，可替换元素)
文章目录一.闭合标签和空标签二.位置特性(块级元素,行内元素,行级块元素) 块级元素(block) 行级元素(inline) 行内块元素(inline-block) 三.元素之间的转化四.可替换 ...
html行级元素和块级元素以及css转换
之前有说过html的标签是有语义的,当然也就有一些默认的样式,比如标题有h1···h6,他们的字体由大至小一次递减,字体比一般字体要加粗. 这样也就有了行级元素和块级元素,下面来看看什么是行级元素什么 ...
行内元素与块级元素，以及区别
行内元素与块级元素首先,CSS规范规定,每个元素都有display属性,确定该元素的类型,每个元素都有默认的display值,分别为块级(block).行内(inline). 块级元素:(以下列举比 ...
一个div 上下两行_web前端工程师如何理解 CSS 布局和块级格式化上下文
CSS是web前端中的重要内容,很多初学者在学习CSS时都会遇到各种各样的问题,今天就给大家分享web前端开发如何理解CSS不惧和块级格式化上下文.也许你从未听说过这个术语,但是如果你曾经用 CSS ...

最新文章

热门文章