• HTML中行内元素与块级元素有哪些及区别


    二.行内元素与块级元素有什么不同?

    块级元素和行内元素的区别是,块级元素会占一行显示,而行内元素可以在一行并排显示。

    通过样式控制,它们可以相互转换。

    1.尺寸-块级元素和行内元素之间的一个重要的不同点

    设置宽度width 无效。
    设置高度height 无效,可以通过line-height来设置。
    设置margin 只有左右margin有效,上下无效。
    设置padding 只有左右padding有效,上下则无效。

    注:这 里说的无效, 是指,它对其它元素的排列没有影响。也就是说,对于设置的margin,padding行内元素文档流里的上下元素来说,他们的间距不会因为上下 margin或者上下padding而产生间距。但是就他本身而言,对于上下margin与padding是有效的。

    上面写的有点绕了,我也是尽量表达。请参照下图,如果还是不清楚,请动手自己写一下,就能明白了。

    HTML中行内元素与块级元素有哪些及区别 - 小脚丫 - celine_窝窝家妞妞

     

    2.text-align属性是两者表现的又以不同之处

    这个特性描述了如何使一个块元素的行内内容对齐。
    注意一点,w3c标准里说这个属性是用来对齐行内内容的,所以,不应该对块级内容起作用。
    解释一下,行内内容是说由行内元素组成的内容,
    这样,我们对这个特性的认识应该就清楚了。但是,问题来了,虽然标准里这么规定,那么是不是所有浏览器都遵守呢?答案是否定的。啊? 又是IE!!
    IE6/7及IE8混杂模式中,text- align:center可以使块级元素也居中对齐。其他浏览器中,text-align:center仅作用于行内内容上。

  • 相关阅读:
    DLL编写教程
    Ogre 配置
    LNK1123: 转换到 COFF 期间失败: 文件无效或损坏
    C++编译,链接错误总结
    git基本操作
    实习第33天
    HTTP状态码整理
    Window下的WebStorm快捷键操作
    告别div,可以代替div的几个标签
    实习20天
  • 原文地址:https://www.cnblogs.com/tian830937/p/6418884.html
Copyright © 2020-2023  润新知