1.经典的双飞翼布局,两边的盒子宽度固定,中间的内容宽度自适应,在某宝某东等一些电商平台比较常见,里面利用了margin的负边距来布局,这样使三个盒子在同一行显示。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
body{
outline: none;
padding: 0;
margin: 0;
color: #fff;
}
.header {
height: 40px;
width: 100%;
background-color: #a01321;
}
.container{
height: 400px;
margin: 0 200px;
}
.left{
width: 200px;
height: 400px;
background-color: green;
float: left;
margin-left: -100%;
position: relative;
left: -200px;
}
.center{
float: left;
height: 400px;
width: 100%;
background-color: red;
}
.right{
width: 200px;
height: 400px;
background-color: blue;
float: left;
margin-left: -200px;
position: relative;
right: -200px;
}
.footer{
height: 40px;
background-color: black;
}
</style>
</head>
<body>
<header class="header"><h4>jfkdslajkfk.s</h4></header>
<div class="container" >
<div class="center">2、文件可能已经被加载过并保存有缓存
一些通用的js库或者是css样式库,如jQuery,在网络中的使用是非常普遍的。当一个用户在浏览你的某一个网页的时候,很有可能他已经通过你网站使用的CDN访问过了其他的某一个网站,恰巧这个网站同样也使用了jQuery,那么此时用户浏览器已经缓存有该jQuery文件(同IP的同名文件如果有缓存,浏览器会直接使用缓存文件,不会再进行加载),所以就不会再加载一次了,从而间接的提高了网站的访问速度
3、高效率
你的网站做的再NB也不会NB过百度NB过Google吧?一个好的CDNs会提供更高的效率,更低的网络延时和更小的丢包率。
4、分布式的数据中心
假如你的站点布置在北京,当一个香港或者更远的用户访问你的站点的时候,他的数据请求势必会很慢很慢。而CDNs则会让用户从离他最近的节点去加载所需的文件,所以加载速度提升就是理所当然的了。
5、使用情况分析
一般情况下CDNs提供商(如百度云加速)都会提供数据统计功能,可以了解更多关于用户访问自己网站的情况,可以根据统计数据对自己的站点适时适当的做出些许调整。
6、有效防止网站被攻击
一般情况下CDNs提供商也是会提供网站安全服务的
</div>
<div class="left">left</div>
<div class="right">right</div>
</div>
<footer class="footer">header</footer>
</body>
<script type="text/javascript">
</script>
</html>
知识兔