怎么浮动上去

Question

<div class="page_left fl">

<dl class="nav">

<dt>

<a href="">

<em>[时髦谈资]</em>

<h3>2017年用好电影来为自己的生活增添色彩</h3>

</a>

</dt>

<dd>

<a href="">2016年有不少精彩电影，现在已跨入2017年，又有哪些值得我们期待的好作品呢？下面推荐一些本年度话题度和精彩度俱佳的好电影，新一年就用好看的新作品来增添些生活情趣吧。</a>

<span><a href>[+]</a><span>

<span class="spa_list">标签：

<a href="">电影</a>

<a href="">2017年</a>

<a href="">清单</a>

</span>

</dd>

<dl>

</div>

<div class="page_right rL">

<ul>

<li>

<a href>

<img src="images/page_ul1.jpg" width="213" height="340" />

</a>

</li>

<li>

<a href>

<img src="images/page_ul2.jpg" width="213" height="340" />

</a>

</li>

<li>

<a href>

<img src="images/page_ul3.jpg" width="213" height="340" />

</a>

</li>

</ul>

</div>

</div>

</div>

css样式：

<style type="text/css">

*{margin:0;padding:0;}

body{font-size:12px;font-family:"微软雅黑";}

a{text-decoration:none;color:#000;font-size:14px;font-family:"微软雅黑";}

.fl{float:left;}

.rl{float:right;}

ul li{list-style:none;}

.main{width:1000px;margin:0 auto;}

.fixclear:after{content:"";display:block;clear:both;}

/*head star*/

.wrap .header{background:#fff}

.wrap .header .header_01{height:67px;}

.wrap .header .header_01 .header_img {margin-top:18px;}

.wrap .header .header_01 .header_search .search_01{text-align:right;line-height:30px;margin-right:43px;}

.wrap .header .header_01 .header_search .search_01 a{margin:0 0 0 10px;}

.wrap .header .header_01 .header_search .header_search_02 form.search_02 .txt01{padding:7px 9px;vertical-align:bottom;width:180px;}

.wrap .header .header_01 .header_search .header_search_02 form.search_02 .txt01:hover{width:233px}

.wrap .header .header_01  .header_search .header_search_02 form.search_02 .btn{width:35px;height:30px;background:url("images/hpftn.png")no-repeat

-306px -370px;border:none;vertical-align:bottom;cursor:pointer;}

/*问题一；设置不了背景颜色,是因为高度*/

.wrap .header .header_02{background:#000;height:46px;}

.wrap .header .header_02 .header_main ul li{width:92px;text-align:center;line-height:44px;border-right:1px solid #fff;float:left;position:relative;}

.wrap .header .header_02 .header_main ul li a{color:#fff;width:100%;display:inline-block}

.wrap .header .header_02 .header_main ul li.list_last{width:160px;border:none;}

.wrap .header .header_02 .header_main ul li .spn_02{width:100%;position:absolute;left:0;top:0;display:none}

.wrap .header .header_02 .header_main ul li :hover .spn_02{display:block;background:red;height:46px;}

/*body star*/

.wrap .main_body{margin-top:10px;}

.wrap .main_body .body_l .btn_img{position:relative;width:690px;}

.wrap .main_body .body_l .btn_img .body_span{width:31px;height:31px;display:inline-block;position:absolute;background:url("images/v5plus.png")no-repeat;right:19px;bottom:15px}

.wrap .main_body .body_l .list_btn{height:52px;border-top:1px solid green;border-bottom:1px solid green;margin-top:20px; overflow:hidden; text-align:center; }

.wrap .main_body .body_l .list_btn .ul1{display:inline-block;height:40px;padding:0px 40px;vertical-align:middle;margin-top:-55px;}

.wrap .main_body .body_l .list_btn .btn_a1{background:url("images/hpftn.png")no-repeat;display:inline-block;width:19px;height:112px;

border-left:1px solid #ccc;border-right:1px solid #ccc;vertical-align:middle}

.wrap .main_body .body_l .list_btn .btn_a1:hover{background-position:-40px 0px;}

.wrap .main_body .body_l .list_btn .btn_a2{background:url("images/hpftn.png")no-repeat -19px 0px;}

.wrap .main_body .body_l .list_btn .btn_a2:hover{background-position:-60px 0px;}

.wrap .main_body .body_l .list_btn .ul1 li {width:60px;height:38px;float:left;}

.wrap .main_body .body_l .list_btn .ul1 .ul1_01 {background:url("images/ul1_01.jpg")no-repeat;}

.wrap .main_body .body_l .list_btn .ul1 li a{display:inline-block;height:100%;width:100%;}

.wrap .main_body .body_l .list_btn .ul1 .ul1_02{background:url("images/ul1_02.jpg")no-repeat}

.wrap .main_body .body_l .list_btn .ul1 .ul1_03{background:url("images/ul1_03.jpg")no-repeat}

.wrap .main_body .body_l .list_btn .ul1 .ul1_04{background:url("images/ul1_04.jpg")no-repeat}

.wrap .main_body .body_l .list_btn .ul1 .ul1_05{background:url("images/ul1_05.jpg")no-repeat}

.wrap .main_body .body_l .list_btn .ul1 .ul1_06{background:url("images/ul1_06.jpg")no-repeat}

.wrap .main_body .body_l{margin-top:10px;padding-bottom:10px;}

/*right*/

.wrap .main_body .body_r{padding-bottom:10px;}

.wrap .main_body .body_r .right_top{margin:10px 0 10px 10px;width:300px;height:250px;}

.wrap .main_body .body_r .right_bottom{margin:10px 0 0 10px;width:300px;height:250px;}

/*body_page*/

.wrap .body_page{margin-top:50px;background:#cc99ff;border-bottom:1px solid #000}

.wrap .body_page .page_hd{background:url("images/hpftn.png")no-repeat 0px -75px;height:45px;}

.wrap .body_page .page_left{width:329px;height:332px;border:4px solid red;background:blue;border-top:5px solid #000;border-left:5px solid #000;border-right:none;border-bottom:1px solid #000;}

.wrap .body_page .page_left .nav{height:305px;width:280px;margin:28px 20px 0px 28px;background:yellow}

.wrap .body_page .page_left .nav dt em{font-style:normal;}

.wrap .body_page .page_left .nav dt a h3{font-weight:normal;margin:20px 0px;font-size:24px;}

.wrap .body_page .page_left .nav dt a h3:hover{color:#C50C11;}

.wrap .body_page .page_left .nav dd {border-top:1px solid #000;}

.wrap .body_page .page_left .nav dd a{font-size:10px;}

.wrap .body_page .page_left .nav dd .spa_list{display:block;margin-top:25px;font-size:14px;color:#999}

.wrap .body_page .page_left .nav dd .spa_list a{font-size:14px;color:#999}

.wrap .body_page .page_left .nav dd .spa_list a:hover{background:#c50c11;}

.wrap .body_page .page_left .nav dd  span a{color:red}

.wrap .body_page .page_right{width:667px;height:340px;}

.wrap .body_page .page_right ul {width:681px;}

.wrap .body_page .page_right ul li{height:340px;width:213px;float:left;}

</style>

最后两张图片怎么浮动上去，对了代码还是浮动不上去

Answer 1

.page_right ul li { float:left; }