zoukankan      html  css  js  c++  java
  • 京东案例小知识2

    小知识
     
    1、同一个父级元素的盒子要么都设置浮动,要么都不设置
    2、行高:line-height:也可以撑开盒子
    3、文字设置行高,默认是包含文字的盒子的高度
     
    4、背景定位,poition,第一个值是左右,第二个值是上下。往上走的都是负值
     
    5position:absolute定位文字,可以脱离标准流,但是行高是可以让文字垂直居中。
     
     
    6、里面的元素都是I标签行内元素包含着,当8 position:absolute定位的时候,不设置left的值,他会把前面元素的宽和panner值给预留出来。

     
    7、设置了定位不给left/top值会出现bug(最好都给上)
     
    8、功能性简单的模块就用简单的代码来写,代码量也少 (下面的文字链接直接用a写)

    9、float浮动:文档相邻同级的盒子设置浮动,会找顶对齐

    10、文字不参与浮动,标准流中的文字不会被浮动的盒子遮挡

    11、padding没有负值 
    12、行内元素有三像素的距离
        a)a标签之间有3像素的距离
        B)图片之间有3像素的距离
     
    圆角矩形
    border-radius:宽/高一半
    border-radius:50%;
    border-radius:0.3em;(字体的高度)
    border-radius:左上角 右上角  右下角  左下角
    border-radius:俩个值是  左上角右下角  右上角左下角
    border-radius:三个值是  左上角 右上角左下角 右下角
     
    什么时候用margin和padding(不考虑宽高)
     
    1、需要使用背景的时候用Padding
    2、会出现外边距合并或者margin塌陷的时候用padding
    3、行内元素上下只能设置padding,不能设置margin.(行内高16)
    4、看border,border里面的padding,外面的是margin.
    5、a链接,鼠标移上去会变色,或是小手padding,单纯的字变色用margin
    6、看需求
     

    层级使用条件 (自己高了,子级就高了)
    1、必须有定位(除去static)
    2、用z-index来控制层级数
     
    li和a的用法
    1、li包含a(给li设置宽高,padding撑开盒子)
    2、a撑开li(给a设置宽高,padding撑开盒子 文字多少不同,不能固定宽,给padding)
     
    盒子撑开和撑破
    1、没有高度的盒子,撑开说明盒子变成那么大
    2、有高度会撑破,盒子还是原来的高
     
    不是同一个父盒子的盒子浮动后也会相互影响
    (也会相互对齐)并且占领下面浮动盒子的位置

    li和a的用法
    1、li包含a(给li设置宽高,padding撑开盒子)
    2、a撑开li(给a设置宽高,padding撑开盒子 文字多少不同,不能固定宽,给padding)
  • 相关阅读:
    2019年8月7日 封装 7夕快乐
    2019年8月4日 多态 苗苗苗苗苗
    2019年7月31日 选课系统
    字符串类型的输入输出
    getline()函数的使用
    出栈序列统计
    因式分解
    质数
    多项式求和
    回文数字
  • 原文地址:https://www.cnblogs.com/wdz1/p/7171675.html
Copyright © 2011-2022 走看看