zoukankan      html  css  js  c++  java
  • 盒子模型

    盒子模型

     

     哪些HTML元素可以设置高和宽属性

    块级元素:

    <p>  <div>  <h1>~<h6>  <ul>  <li>  <ol>  <dl>  <dt>  <dd>

    替换元素:

    浏览器根据其标签的元素与属性来判断显示的具体内容<img>  <input>  <textarea>等

     边框属性

     4个不同方向来表示(上、下、左、右)

    表示:

    border-[left|right|top|bottom]-width

    border-[left|right|top|bottom]-color

    border-[left|right|top|bottom]-style

    margin的值可以设置为负值,而padding的值不能设置为负值

    margin值为auto,实现水平方向居中显示效果(由浏览器计算外边距)

    外边距属性

    垂直方向,两个相邻元素都设置外边距,外边距会发生合并

    合并后外边距高度=两个发生合并外边距的高度中最大值

     标准盒子模型

    IE盒子模型

    width=左右边框+内容宽度+左右填充

    height=上下边框+内容高度+上下填充

    注:

    1.如果没有Doctype文档类型声明,各浏览器按照自己的方式解析。

    2.如果有Doctype文档类型声明,按照标准盒子模型来解析。

    display属性

    inline:元素将显示为内联元素,元素前后没有换行符(如果将块级元素设置成display:inline则就不具备宽高属性了)

    block:元素将显示为块级元素,元素前后会带有换行符

    inline-block:行内块元素,元素呈现为inline,具有block相应特性

    none:此元素不会被显示

    样式继承关系

  • 相关阅读:
    Java面向对象之封装静态
    分布式平台Spark环境的搭建
    高斯混合模型
    异常排除: 调用方未由服务进行身份验证
    HttpClient介绍和简单使用流程
    阿里短信服务的使用流程
    笔记工具选择
    特效图文制作
    语言基础(23):智能指针
    无线通信基础(一):无线网络演进
  • 原文地址:https://www.cnblogs.com/helloCindy/p/11580430.html
Copyright © 2011-2022 走看看