zoukankan      html  css  js  c++  java
  • css 的基础样式--border--padding--margin

    border 边框
    复合写法 border:border-width border-style border-color;

    border-width 边框宽度
    border-style 边框样式:solid实线 dashed虚线 dotted点线 (点线 IE6不认)
    border-color 边框颜色:英文单词/十六进制/rgb

    border-width还能再细分为
    boder-top-width border-right-width
    border-bottom-width border-left-width

    当宽高为0px时,边框均等100px,会构成四个三角形拼成的正方形;
    之上添加 border-radius:50%; 会构成四个三角形拼成的圆形;

    transparent 透明
    可以把颜色设置成透明

    padding设置内边距(或者叫内填充)
    padding-top
    padding-right
    padding-bottom
    padding-left

    padding复合写法:
    一个值指定上右下左都是这个值
    两个值指定上下、左右
    三个值指定 上 左右 下
    四个值指定 上 右 下 左
    (四个值简记为顺时针的顺序)

    div标签的占地面积宽高等于
    (width+border+padding)x(height+border+padding)
    边框border 内填充padding都是具有占地面积的

    margin 外边距(分上右下左);
    复合写法:与padding一样意思;

    标签的嵌套:确定父子级关系,
    1.第一个子级的margin-top会在特定的情况下穿透父级(穿透父级指的是它直接对父级生效,带着父级一起在上方形成边距);
    规避方法:(1)给父级加边框;
    (2)给父级加overflow:hidden;
    (3)用父级的padding-top代替子级的margin-top;

    2.兄弟关系的margin-top和margin-bottom会叠在一起导致重叠;
    解决方式:兄弟之间的margin-top 和margin-bottom无法避免,只能将其中一个设置成两者之和来加以修正

  • 相关阅读:
    计算机网络技术基础2
    java基础
    跨页传递参数或临时表的几种方法
    ASP.NET2.0文件上传以及图片处理总结篇 [转]
    正则表达式
    ASP.NET2.0中WEB应用程序的部署
    比较著名的.net技术论坛名称
    WordPress 插件开发实例 – 详细注释的 Widget 开发例子
    Java Applet签名验证
    Java Logging API Tutorial
  • 原文地址:https://www.cnblogs.com/davis16/p/8316397.html
Copyright © 2011-2022 走看看