html 哪些是块级元素、哪些是行内元素?

html 哪些是块级元素、哪些是行内元素?行内块级元素,拥有行内元素的特性,不换行,也拥有块级元素的特性:既可以设置宽高也可以设置上下左右边距。

欢迎大家来到IT世界,在知识的湖畔探索吧!

块级元素:使用时,会自动换行的元素,可以包含行内元素和其他块级元素,可以设置宽,高,上下左右边距,默认 css 属性 display 的值为 block

  • 块级元素常用的有哪些
  1. div // 块, 经常用来布局的块,类似箱子
  2. h1-h6 // 标题,肯定是会换行的啦
  3. p // 段落,我们写文章,段落也是换行处理的
  4. ul,ol,li // 列表,总不希望你写的列表,表格还跟其他东西掺杂一起吧,
  5. from // 表单,输入框总希望能够单独是一块独立的
  6. table // 表格,表格要整洁,总希望独立出来
  7. hr // 水平分割线,既然要分割,那也是要换行处理吧
  8. pre // 预格式化文本,代码按照我们手动编排好的顺序输出,你总不希望他还不给你行吧,不然就没意义了
  9. footer // 段尾,类似写作文结尾,都是另起一行
  10. article // 文章内容,看书的时候,文章内容都会在合适的位置给换行处理
  11. canvas // 绘制图形
  12. address // 地址

行内元素:不会自动换行,不可以设置宽高,只能设置左右边距,默认 css 属性 display 的值为 inline

  • 块级元素常用的有哪些?
  1. b // 加粗
  2. big // 定义大字号
  3. i //斜体
  4. small // 小号文本
  5. abbr // 定义缩写,有些国际词语是有缩写的
  6. acronym // 定义只取首字母的缩写
  7. cite // 引用,文章内容的某一句话可能是引用其他名人说的
  8. code // 定义计算机代码
  9. dfn // 定义一个定义项目
  10. em // 定义强调的本文
  11. kbd // 定义键盘文本
  12. strong // 定义重要的文本
  13. samp // 定义样本文本。
  14. var // 定义变量
  15. a // 锚点,内容里经常会有几个关键词,可以点击过去查阅更多详细信息
  16. bdo
  17. br // 换行
  18. object // 内嵌对象
  19. q // 短的引用
  20. script
  21. span // 普通文档的节
  22. sub // 定义下标文本
  23. sup // 定义上标文本
  24. button // 按钮,
  25. input // 控件
  26. label // input 元素定义标注
  27. select // 定义选择列表,看起来很多,实际上占位就我们选择的那一个
  28. textarea // 定义一个多行的文本输入控件

行内块级元素,拥有行内元素的特性,不换行,也拥有块级元素的特性:既可以设置宽高也可以设置上下左右边距,默认 css 属性 display 的值为 inline-block

常见行内块级元素:

  1. img // 图片
  2. video // 视频
  3. audio // 音频
  4. map // 图像映射

块级元素和行内元素如何转换

  • 块级元素变成行内元素

display: inline;

  • 行内元素变成块级元素

display: block;

  • 块级元素、行内元素变成行内块元素

display: inline-block;

其他

  • a 标签只允许嵌套非 a 标签的 inline 类型元素。
  • 这么多,不要为难自己死记硬背,记住常用的,用常识去记住就可以啦,面试考你的时候,记不住的,用常识去推理,基本都正确。
html 哪些是块级元素、哪些是行内元素?

免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://itzsg.com/35009.html

(0)

相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

联系我们YX

mu99908888

在线咨询: 微信交谈

邮件:itzsgw@126.com

工作时间:时刻准备着!

关注微信