HTML代碼：

<div class="list_main">

? <div class="list_left">

? <h2>新聞中心</h2>

? <div class="news_type_list">

? <ul>

? <li><a href="list.html">公司新聞</a></li>

? ?<li><a href="list.html">媒體報道</a></li>

? ? <li><a href="list.html">行業(yè)新聞</a></li>

? ? ?<li><a href="list.html">活動專題</a></li>

? ? ? <li><a href="list.html">精彩視頻</a></li>

? ? ? ?<li><a href="list.html">資源下載</a></li>

? ? ? ? <li><a href="list.html">公司內(nèi)刊</a></li>

? </ul>

? </div>

? </div><!--list_left結(jié)束-->

<div class="list_right">

<h1 class="newsTitle">慕課網(wǎng)獲App Store強(qiáng)力推薦榮登四榜單</h1>

? ? ? ? <p class="newsInfo">發(fā)布人：Admin 發(fā)布時間：2014-08-01 瀏覽：5321次</p>

? ? ? ? <div class="newsContent">

? ? ? ? <p> 8月伊始，慕課網(wǎng)App即獲得了App Store的多個推薦，同時出現(xiàn)在“免費App精選”、“致畢業(yè)生”、“學(xué)而不倦”以及“輕松學(xué)編程”四個榜單中。這款I(lǐng)T編程學(xué)習(xí)類的App為何如此備受青睞？趣味視頻課程、高清畫面質(zhì)感、在線離線隨身學(xué)習(xí)……優(yōu)質(zhì)的課程內(nèi)容結(jié)合良好的用戶體驗，慕課網(wǎng)App無疑是IT學(xué)習(xí)的最佳選擇。</p>

? ? ? ? <p> App Store力薦慕課網(wǎng)榮登四榜單</p>

? ? ? ? <p>App Store因公平著稱，能被其推薦是每一款A(yù)pp夢寐以求的榮譽，慕課網(wǎng)則一舉占據(jù)了其四個榜單，包括精品推薦首頁“合集”版塊下“免費App精選”中的“新品”推薦、“合集”版塊“致畢業(yè)生”中“學(xué)無止境”推薦、教育類別“合集”版塊下“學(xué)而不倦”中的推薦以及“輕松學(xué)編程”版塊推薦。</p>

? ? ? ? <p><img src="images/news1.jpg" width="500" height="420" alt=""/></p>

? ? ? ? <p>事實上，慕課網(wǎng)登上App Store榜單并非首次。早在2014年5月，慕課網(wǎng)就榮登App Store 精品推薦榜首，同時登上“教育”類別下“優(yōu)秀新App”榜首，并獲評“五月最佳”精彩App。隨后，慕課網(wǎng)App接連出現(xiàn)在“致畢業(yè)生”、“免費App精選”、“夏日學(xué)堂”等榜單中。</p>

? ? ? ? <p>從App Store的持續(xù)推薦以及“優(yōu)秀”、“精選”的肯定中不難看出，慕課網(wǎng)在IT在線學(xué)習(xí)領(lǐng)域以及教育類App中得到了用戶的認(rèn)可。</p>

? ? ? ? <p>新功能上線持續(xù)提升用戶體驗一款好的產(chǎn)品同樣需要不斷改進(jìn)來滿足用戶需求。慕課網(wǎng)App上線至今進(jìn)行了多個版本的迭代，不斷完善產(chǎn)品、提升用戶體驗，ios最新的2.1.0版本于7月20日更新，上線了大量新功能。</p>

? ? ? ? <p>明確、清晰的課程分類能夠讓用戶迅速找到感興趣的課程，本次慕課網(wǎng)就上線了全新的課程分類方式，點擊“全部課程”即可顯示出全部的技術(shù)語言種類以及視頻課程數(shù)量，全部在線課程一目了然。</p>

? ? ? ? <p>不知道講師在哪里？此版本更新中添加了講師認(rèn)證，不僅對講師空間進(jìn)行了認(rèn)證，在課程討論和筆記中，通過認(rèn)證標(biāo)識，一眼可以看到哪個是講師回復(fù)。</p>

? ? ? ? <p>此外，慕課網(wǎng)App在最新版本中調(diào)整了下拉刷新和上拉加載的效果；課程練習(xí)部分增加了習(xí)題解析；對半透化效果、全屏播放器按鈕進(jìn)行了優(yōu)化，并新增了編程課、ps課程。一系列的改進(jìn)相信能為IT學(xué)習(xí)用戶帶來更好的學(xué)習(xí)體驗。</p>

? ? ? ? <p>慕課網(wǎng)App在精品視頻課程的基礎(chǔ)上，不斷優(yōu)化用戶體驗，幫助IT學(xué)習(xí)者迅速入門、提升技能，以優(yōu)秀的產(chǎn)品基因獲得App Store的多個推薦，使更多用戶有機(jī)會使用這款I(lǐng)T學(xué)習(xí)軟件，體驗學(xué)習(xí)的簡單和快捷。</p>

</div>

</div><!--list_right結(jié)束-->

</div><!--list_main結(jié)束-->

CSS代碼：

.list_main{min-height:350px;_height:350px;margin-top:10px;}

.list_left{width:220px;

? ? ? ? ? height:350px;

?

?float:left;border:1px solod #E8E8E8;}

.list_left h2{width:200px;height:35px;background:url(images/titile_bg.gif) repeat-x;font-family:"Microsoft YaHei UI";color:#666;font-size:14px;padding-left:20px;line-height:35px;}

.news_type_list li{list-style:none;height:30px;line-height:30px;/*text-align:center;*/}

.news_type_list a{text-decoration:none;color:#666;background:url(images/li_bg.gif) no-repeat center left;

? padding-left:15px;}

.news_type_list a:hover{background:url(images/li_bg2.gif) no-repeat center left;color:#009CDF;background-color:#F2F2F2;display:block;}

/*具體新聞內(nèi)容樣式*/

.list_right{width:770px;

? ? ? ?min-height:350px;/*最低高度 在IE6不能使用*/

?_height:350px;/*只在IE6可用 只要內(nèi)容大的時候，自動撐開盒子 只需要設(shè)置盒子的高度*/

?float:right;border:1px solod #E8E8E8;}

?.list_right h2{font-family:"Microsoft YaHei UI";height:35px;line-height:35px;font-size:14px;color:#666;background:url(images/titile_bg.gif) repeat-x;padding-left:20px;}

/*新聞詳細(xì)內(nèi)容樣式*/

.newsTitle{font-size:20px;font-family:"Microsoft YaHei UI";text-align:center;padding:10px;}

.newsInfo{font-size:12px;border-bottom:1px solid #E8E8E8;color:#666;text-align:center;}

.newsContent{font-size:14px;line-height:25px;text-indent:2em;}

.newsContent img{margin:5px auto;display:block;}