HTML中div与span标签的区别(带图)

HTML中div与span标签的区别(带图)

   html的div和span, 经常会用到, 尤其是前者。

        1. div是块级元素, 实际上就是一个区域, 主要用于容纳其他标签。 默认的display属性是block

        2. span是行内元素, 主要用于容纳文字。 默认的display属性是inline

测试代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>demo</title>
    <style>
        div{
            background: red;
        }
        span{
            background: red;
        }
    </style>
</head>

<body>
<p>测试</p>
<span >我是span,行内元素</span>
<div>我是div,块级元素</div>
</body>
</html>

区别如图所示:

HTML中div与span标签的区别(带图)

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/114753.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 虎年港股并购开门红 多牛集团3亿并购九尊数字互娱「建议收藏」

    虎年港股并购开门红 多牛集团3亿并购九尊数字互娱「建议收藏」2月8日消息,九尊数字互娱(股票代码:01961.HK)发布联合公告称,公司已经接到价值3亿元港币的收购要约。这也是2022年开年不到一个月以来,继Zynga、动视暴雪之后全球游戏业又一起重大并购。九尊数字互娱集团控股有限公司是一家在香港主板上市的移动互联网泛娱乐内容提供商,主营业务包括手机游戏的研发和运营,数字媒体如电子杂志、漫画、音乐等的分发和营销。2020年公司收入为1.7亿元人民币。根据公告显示,九尊数字互娱五名股东以3亿港币的估值,向InfinitiesGlobalTechnology

    2022年6月9日
    31
  • arm汇编指令详解带实例_汇编buf指令

    arm汇编指令详解带实例_汇编buf指令ARM的编程模式和七种模式基本设定架构(32位)约定Byte(字节):8bitsHalfword(半字):16bits(2byte)Word(字):32bits(4byte)指令集ARM指令集(32-bit)Thumb指令集(16-bit)Thunmb指令集(16&32bit)不考虑工作模式种类:七种非特权模式(Normal:普通模式)User(用户模式):非特权模式,大部分时候在这个模式下工作特权模式(Privilege:特

    2022年10月14日
    4
  • 搭建JavaWeb服务器[通俗易懂]

    搭建JavaWeb服务器[通俗易懂]JDK安装可以参考 http://www.cnblogs.com/a2211009/p/4265225.htmlTomcat安装可参考1.由于服务器配置比较低综合考虑,选择ubuntu系

    2022年7月1日
    32
  • express根据token获取用户id「建议收藏」

    //登陆时注册tokendb.query(`select*fromuserwherename=${username}andpassword=’${password}’`,(result)=>{if(result.length==1){ //jwt.sign({userId:result[0].id}在注册的时候加入用户id…

    2022年4月14日
    227
  • 建立数据库链接_html连接数据库

    建立数据库链接_html连接数据库建立数据库链接CREATE[public]DATABASELINK数据库链接名CONNECTTO用户名IDENTIFIEDBY密码USING数据库连接字符串;说明:   1.一般情况PUBLIC由数据库管理员来创建;个人用户可以不加public,是私有的数据库链接;   2.数据库连接字符串可以用NET8EASYCONFIG或者直接修改TNSNAMES.OR

    2025年11月30日
    7
  • IDEA 快捷键大全

    IDEA 快捷键大全Ctrl+Shift+Enter,语句完成“!”,否定完成,输入表达式时按“!”键Ctrl+E,最近的文件Ctrl+Shift+E,最近更改的文件Shift+Click,可以关闭文件Ctrl+[OR],可以跑到大括号的开头与结尾Ctrl+F12,可以显示当前文件的结构Ctrl+F7,可以查询当前元素在当前文件中的引用,然后按F3可以选择Ctrl+N,可以快速打开类C…

    2022年5月14日
    51

发表回复

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

关注全栈程序员社区公众号