html仿今日头条数据列表

例子代码下载:http://download.csdn.net/detail/friendan/9503019

效果截图:

html仿今日头条数据列表_第1张图片

收获如下:
1、使用Respond.js解决了Bootstrap3栅格系统不兼容IE8的问题。
2、知道了如何让两个div盒子完美的左右相邻。
------------------------------------------------------------------
碰到的问题:
1、两个div盒子都左浮动float:left后,虽然能够达到左右相邻的效果,
   但是当右边div盒子的内容长度过长时,右边的div盒子会自动换行,
   导致了两个div不能够左右相邻显示。我尝试过使用overflow: hidden;
   然而并不能解决该问题。。。

解决方法:
    只浮动一个div盒子即可,如左边的div设置float:left;右边div不浮动,设置其margin-left: 160px;即可。
  ----------------------------------------------------------------------------------------------------------------------------------------------------------------------

最后贴下html代码:



	
		
    
    
    
    
		仿今日头条列表

		

	  
	  
	  
	  
		
		
	

	

	

		
  • 京剧大师梅葆玖上午病逝,享年82岁。梅葆玖3月31日因突发支气管痉挛,导致脑缺氧送医院抢救。 梅葆玖是1934年出生在上海,是梅兰芳的第九个孩子。梅葆玖也是梅派艺术的传人, 目前是北京京剧院梅兰芳京剧团的团长, 他的代表作品有《霸王别姬》...

  • 121周内确诊10起手足口病例幼儿园停课整顿10天4月12日,南宁明秀东路上某幼儿园一班上有一名学生在校时高烧, 回家后被确诊为手足口病。当时该学生家长及时通知园方...

  • item
  • item
  • item
右边






你可能感兴趣的:(html)