前端基本功--css实战1 9.10

一、京东页面

1.Font字体综合写法

font:字体加粗  字号/行高 字体;

font-weight:bold = 700;正常是400

2.用于做一些小装饰的标签:

s  del删除线

i   em倾斜

u   ins下划线

3.字体的装饰:

字体加粗font-weight: 700;

让字体不加粗:  font-weight:normal;

字体倾斜:  font-style:italic;不用

字体不倾斜:font-style:normal;

不下划线不删除线:  text-decoration: none;

4.定位

(1)position:static 静态定位 约等于标准流

(2)浮动的不浮动 float:none;  none left right

        定位的不定位  position:static ;  absolute relative fixed

5.权重问题

标签 1   类10     id 100    行内1000

6.网页的稳定性

Width和height最稳定  其次padding  最后才考虑margin

7.关于浮动

浮动目的:可以让多个块级元素放到一行上。

清除浮动的目的:就是为了解决父盒子高度为0的问题。

清除浮动:

1.额外标签法

2. Overflow: hidden触发bfc模式 就不用清楚浮动

3.伪元素

.clearfix:after {

content:””;

Visibility:hidden;

Display:block;

Height:0;

Clear:both;

}

.clearfix{

Zoom:1;

}

清除浮动:真正的叫法闭合浮动(将clearfix加在父级元素上)

.clearfix:before,.clearfix:after{

display:table;

content:"";

}

.clearfix:after{

clear:both;

}

.clearfix{

zoom:1;

}

overflow:hidden;属性可以保证div的高度或宽度不变。

div里添加的东西再多,高度或宽度也不变。超出的部分隐藏。使盒子保持本身的宽高。

你可能感兴趣的:(前端基本功--css实战1 9.10)