HTML标签中行内元素和块级元素详解

本文主要和大家详细介绍了html常用的标签中行内元素和块级元素,需要的朋友参考下吧,希望能帮助到大家。

块元素(block element) HTML标签分类明细 

    * address – 地址
    * blockquote – 块引用
    * center – 举中对齐块
    * dir – 目录列表
    * p – 常用块级容易,也是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) HTML标签分类明细  

    * 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 – 定义变量

立即学习“前端免费学习笔记(深入)”;

可变元素  HTML标签分类明细 

    * applet – java applet  
    * button – 按钮  
    * del – 删除文本  
    * iframe – inline frame  
    * ins – 插入的文本  
    * map – 图片区块(map)  
    * object – object对象  
    * script – 客户端脚本

总结:

1.块级元素 block 如 p h1 p ul li等 会换行 想在同一行显示  

需浮动或者display: inline

2.行级元素 inline 如 a span b 多个可以并排显示 默认设置宽度是不起作用 
 

需设置 display: inline-block或者block才行。

相关推荐:

汇总三种行内元素转为块级元素的方法

汇总三种行内元素转为块级元素的方法

汇总三种行内元素转为块级元素的方法

以上就是HTML标签中行内元素和块级元素详解的详细内容,更多请关注【创想鸟】其它相关文章!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

点点赞赏,手留余香

给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!
    编程技术

    HTML5 Ajax文件上传进度条如何显示

    2025-4-1 2:00:04

    编程技术

    Dreamweaver网页制作使用css样式嵌套方法

    2025-4-1 2:00:12

    0 条回复 A文章作者 M管理员
    欢迎您,新朋友,感谢参与互动!
      暂无讨论,说说你的看法吧
    个人中心
    购物车
    优惠劵
    今日签到
    私信列表
    搜索