【疑问】css

1.p{float:left}好像意思是p后面的元素往左浮动的意思啊!!
2.ff下,button的文字好像没法垂直居中
2.1 button垂直对齐,其line-height似乎需要减2px(依边框宽度而定)
3.inline-block同inline有什么区别
4.继承得到的font-size有小数点
5.<i class="display:inline-block;width
20px;height:20px;background:green"></i><p style="height:100px;background:red"></p>
为何两者间有垂直间距
6.overflow:hidden的margin-top不能不被浮动的兄弟元素覆盖?
7.我认为ff下可能input超出div的高度会被隐藏,而chrome下则不会
8.position:fixed;好像只能相对浏览器窗口定位
9.botton在ff下默认是border-box
10.botton在FF下默认将color应用到border-color
11.如果只有两个inline-block,只为其中设置一个vertical-align两个都会有相同的效果。
12.如何换行且溢出显示省略号?
13.
对i添加这条
    display: inline-block;
    width: 120px;
    overflow: hidden;/*一加这句,垂直对齐就必须加上vertical-align:middle了,不然不会与兄弟元素垂直对齐*/
    text-overflow: ellipsis;
    word-break: keep-all;
    white-space: nowrap;

14.vertical-align:middle;可能会导致父元素增高,原因未知。猜测与子元素高度为奇数有关
15.
<div style="display:inline-block">
    <p style="width:50%">
        <span>asd</span>
    </p>
</div>
按理说,子元素p宽度为div的父元素的50%,算是比较合理的。但事实上不然,会是一个无法理解的结果:div不知从哪儿获得宽度(并非其父元素的50%),而p的宽度是div的50%。
16.以上的貌似可以诞生一个技巧:实现父元素为子元素的两倍宽度;【未证实】
当然,这个实现可以用更符合预料的手法:子元素的子元素设定width:200%;
17.继续讨论,p中的span若设定inline-block且width:2em,那么div将根据span定义宽度,而p的宽度为div的一半,也为span的一半。
也就是说,这实现了父元素(p)为子元素(span)一半宽度。
若设定p的width:200%,是否就是实现了16了呢?
18.overflow-x:hidden,单设定这一个时溢出,会在ff下出现垂直滚动条
19.给父元素设置这些值,其中的inline-block子元素溢出时不会被父元素的右padding遮盖?

    overflow: hidden;
    white-space: nowrap;

20.如何实现,i浮动在左侧,而p垂直排列?div与i不能设置固定高度,可设置百分比。
<div>
  <i />
  <p />
  <p />
  <p />
</div>
21.td里使用float:right会导致垂直不对齐

22.我常常使用有针对性的写法:
.clients .row {width:10px;}
与之相反的写法是:
.row {width:10px;}
无针对性的写法会导致.row的设定被用到任一个.row中。
有针对性的写法会使得此设定的优先级较高,而像.auto {width:auto;}这种规则就无法运用上。

posted @ 2017-03-06 18:53  FranQ  阅读(131)  评论(0编辑  收藏  举报