zoukankan      html  css  js  c++  java
  • css中的内联对象与块对象 转

     css中的内联对象与块对象


    在用CSS做页面的时候,我们总是会想到块对象和内联对象,那到底指的是什么呢?
    为什么说加上float或display:block就是块对象了呢?

    块对象默认宽度是100%(继承自父元素),如果没有采用“float:left/right;”样式,相邻的两个块对象就会分排在不同的两行上。

    内联对象的宽度取决于其内部元素的宽度与padding样式值之和,不可直接指定其宽度与高度(“display:block;”、“float:left/right;”强行转换后可以定义),相邻的两个内联对象会排在同一行上。

       
    从这两点就应该可以看出来块对象和内联对象两者的区别,关于为什么加上float就成为块对象了,是因为float默认的就是display:block; display:inline是表示内联对象;display:block表示块对象。

    以下更清楚的告诉你两者的区别:

    什么是内联对象,什么是块对象?

    所有可视的文档对象都是块对象(block element)或者内联对象(inline element)。例如, div 是一个块对象,span 是一个内联对象。

    块对象的特征是从新的一行开始且能包含其他块对象和内联对象。从新的一行开始:比如div就是前后断行;
    内联对象被呈递时不会从新行开始,能够包含其他内联对象和数据。内联可以这样理解:不从新的一行开始,直接从内容里面,接着往后走。。。是指它能被别的对象内联。。。。


    ==========================
    相关信息参考:css display参数

    block   : CSS1   块对象的默认值。将对象强制作为块对象呈递,为对象之后添加新行 
    none   : CSS1   隐藏对象。与 visibility 属性的hidden值不同,其不为被隐藏的对象保留其物理空间(页面物理尺寸大小空间) 
    inline   : CSS1   内联对象的默认值。将对象强制作为内联对象呈递,从对象中删除行


    改变此属性值(即:display)对其周围内容布局的影响可能是:

    属性值设为 block 的在对象后面添加新行。 
    属性值设为 inline 的从对象中删除一行。 
    属性值设为 none 的对象隐藏并释放其在文档中的物理空间(页面物理尺寸大小空间)。

  • 相关阅读:
    win 下 docker 环境配置
    【译】PHP 内核 — 字符串管理
    Elasticsearch和Lucene的关系
    如何写出高性的SQL语句?
    Java 8
    Cause: java.sql.SQLSyntaxErrorException: ORA-01719: OR 或 IN 操作数中不允许外部联接运算符 (+)
    sql 使用 in 后数据量太大报错
    java8-求最小值(8中方法)
    Oracle 强制索引
    为什么新安装eclipse idea等环境,初次运行java程序,会弹出windows防火墙信息
  • 原文地址:https://www.cnblogs.com/ideaplusl/p/2158810.html
Copyright © 2011-2022 走看看