首页 > 汽车 >

前端工程师之CSS常用技巧大合集(3)

2019-02-14 22:52:50 网络整理 阅读:186 评论:0

</body>

</html>

绝对定位<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Title</title>

<style type="text/css">

body {

margin: 0;

padding: 0;

}

.left {

position: absolute;

left:0px;

left: 300px;

height: 100px;

background-color: red;

}

.right {

position: absolute;

right:0px;

width: 300px;

height: 100px;

background-color: blue;

}

.center {

position: absolute;

left:300px;

right:300px;

background-color: black;

height: 100px;

}

</style>

</head>

<body>

<div class="father">

<div class="left">1</div>

<div class="center">2</div>

<div class="right">3</div>

</div>

</body>

</html>

CSS优化(1)压缩

(2)属性连写: font :font-style font-weight font-size

(3)继承:font clolr

(4) CSS放入Head中,减少reflow repaint

相关文章