简单网页设计与布局
Posted 时过境迁E
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了简单网页设计与布局相关的知识，希望对你有一定的参考价值。
<title>电影海报</title>
<style type="text/css">
*{
background-color:#000;
}
.dianying{
float:left;
width:200px;
height:300px;
margin:30px;
font:"微软雅黑";
font-size:18px;
color:#F00;
text-align:center;
line-height:50px;
vertical-align:middle;
}
#reying{ font:"微软雅黑";
color:#CF0;
margin:20px;}
</style>
</head>
<body>
<div id="reying">正在热映</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMTg0NDg3MTU0MA==.html?spm=a2hmv.20009921.yk-slide-86993.5~5!2~5~5!2~A&from=y1.3-movie-grid-1095-9921.86994-86993.2-1" target="_blank"><img src="捉迷藏.png" /></a>《捉迷藏》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMTg5MTg0ODcxMg==.html?spm=a2hmv.20009921.yk-slide-86993.5~5!4~5~5!2~A&from=y1.3-movie-grid-1095-9921.86994-86993.4-1" target="_blank"><img src="超级快递.png"/></a>《超级快递》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMTczNDIwMjIwMA==.html?spm=a2hmv.20009921.yk-slide-227232.5~5!10~5~5!2~A&from=y1.3-movie-grid-1095-9921.227266-227230-227232.10-1" target="_blank"><img src="寒战2.png" /></a>《寒战2》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMjY4MTMzNDI4OA==.html?spm=a2hmv.20009921.yk-slide-86993.5~5!5~5~5!2~A&from=y1.3-movie-grid-1095-9921.86994-86993.5-1" target="_blank"><img src="乘风破浪.png"/></a>《乘风破浪》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMjQ3OTQxMjM3Mg==.html?spm=a2hmv.20009921.yk-slide-86993.5~5!11~5~5!2~A&from=y1.3-movie-grid-1095-9921.86994-86993.11-1" target="_blank"><img src="冲天火.png" /></a>《冲天火》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMTg3NzA4NDg1Mg==.html?spm=a2hmv.20009921.yk-slide-227232.5~5!8~5~5!2~A&from=y1.3-movie-grid-1095-9921.227266-227230-227232.8-1" target="_blank"><img src="湄公河行动.png" /></a>《湄公河行动》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMTc2NjE4MDM1Mg==.html?spm=a2hmv.20009921.yk-slide-227232.5~5~5~5!2~A&from=y1.3-movie-grid-1095-9921.227266-227230-227232.1-1" target="_blank"><img src="魔兽.png" /></a>《魔兽》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMjUxNjQ3MDYxMg==.html?spm=a2hmv.20009921.yk-slide-227692.5~5!6~5~5!2~A&from=y1.3-movie-grid-1095-9921.227266-227230-227692.6-1" target="_blank"><img src="情圣.png" /></a>《情圣》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XMTM5OTY1NTI4MA==.html?spm=a2hmv.20009921.yk-slide-227692.5~5!4~5~5!2~A&from=y1.3-movie-grid-1095-9921.227266-227230-227692.4-1" target="_blank"><img src="夏洛特烦恼.png" /></a>《夏洛特烦恼》</div>
<div class="dianying"><a href="http://v.youku.com/v_show/id_XODMzOTcyNjg0.html?spm=a2hmv.20009921.yk-slide-227692.5~5~5~5!2~A&from=y1.3-movie-grid-1095-9921.227266-227230-227692.1-1" target="_blank"><img src="心花路放.png" /></a>《心花路放》</div>
以上是关于简单网页设计与布局的主要内容，如果未能解决你的问题，请参考以下文章
FAB 的片段布局与 CoordinatorLayout 冲突