自动“包裹”从PHP数据库查询结果

我想这样做：自动“包裹”从PHP数据库查询结果

- 当我赞同从MySQL查询我的结果，我想显示每一个在一个正方形的div（这是排序）

- 我也想包装他们，所以他们都在horisontal行，但是当屏幕不够宽，有的去到更多的行

第二点就是我”米坚持着。我如何包装很多div，比如文字包装会对文本做什么？

谢谢！

来源

2012-03-29 Jacques Blom

这看起来更像是一个css问题。如果将每个“div”的宽度设置为“auto”，则div应该是视口的宽度，并在调整浏览器大小时调整大小。 – F21 2012-03-29 22:58:56

这样的jsFiddle example？

CSS：

div { 
    border:1px solid #999; 
    width:30px; 
    height:30px; 
    float:left; 
    margin:4px; 
}

来源

2012-03-30 00:52:40 j08691

准确！非常感谢。它完美的作品 – 2012-03-30 23:20:27

我觉得这个剧本产生你要求的布局：

<html><head><script> 
    // dummy code to simulate varying width text received from a database 
    var pullFromDatabase = function(){ 
     str = new String() 
     for(var i = Math.round(Math.random()*10)+1; i > 0; i--) 
      str += "Data! " 
     return str 
    } 

    window.onload = function(){ 
     for(var i = 10; i > 0; i--){ 
      newDiv = document.createElement('div') 
      newText = document.createTextNode(pullFromDatabase()) 
      newDiv.appendChild(newText) 
      document.body.appendChild(newDiv) 
     } 
    } 
</script><style> 
    div { float: left; width: 200px; height: 200px; border-width: 1px; border-style: solid; border-color: black } 
</style></head><body> 

</body></html>

检查它在你的HTML编辑器，看看它看起来像你想要什么。浮动：左边是让他们“包裹”的关键。请注意，该问题主要是一个CSS，而不是PHP或JS。

来源

2012-03-30 01:44:14 pagga

自动“包裹”从PHP数据库查询结果

回答

相关问题