京东PC首页一

发表于 | 分类于

项目初始化，文件目录，css初始化，网站图标

文件目录

1
2
3
4
5
css                     //css文件夹
js                      //js文件夹
images                  //图片文件夹
index.html              //首页
favicon.ico             站点图标

css位置

内嵌

1
2
3
4
5
<style>
p {
  height: 100px;
}
</style>

外联

1
<link rel="stylesheet" href="index.css">

层级: 行内 > 内嵌 > 外联
样式权重: 标签(1) < class(10) < id(100) < 行内(1000) < !important

网页稳定

1
2
3
width 和 height 最稳定
其次 padding
最后才考虑 margin

浮动

浮动的目的

1
让多个块级元素放在同一行上,如li标签

清除浮动

也叫闭合浮动，是为了清除浮动带来的影响
产生浮动的原因
子元素设置了浮动，你父元素没有设置高度

1
2
3
4
5
6
7
8
9
10
11
.clearfix:after,
.clearfix:before {
  content: " ";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
.clearfix {
  zoom: 1;
}

鼠标样式

1
cursor: pointer

样式书写顺序