如何使用数据创建动态 div答案

【问题标题】：How do i create dynamic div with data如何使用数据创建动态 div
【发布时间】：2020-09-28 02:37:10
【问题描述】：

我正在使用内部 html 来获取带有 sql server 数据的动态 div。 div 排列不是水平对齐的。需要水平对齐它们。请帮帮我。谢谢

        pnl_default.Visible = true;
        pnl_content.Visible = false;
        HtmlGenericControl html_default = new HtmlGenericControl();
        html_default.TagName = "div";

        string cmdString = ".........";


        DataTable dtSystems = OraQueryData(cmdString);
        foreach (DataRow dtRow in dtSystems.Rows)
        {
            string system_name = Convert.ToString(dtRow["Branch"]);



            var btn_system = new Button
            {
                ID = "btn_" + system_name,
                Text = system_name,

                CssClass = "myButton2"
            };

            string html = " <div class=div1> <div class= pnlback >  <div class= header> <b>" + system_name + " </b></div><div class= body> <img style= width: '50px'; height: 50px src =/Scripts/atm.png> </div><div class=footer><button  runat=server>SHOW</i></button></div></div> </ div >   <span></ span >   ";

            html_default.Controls.Add(new LiteralControl(html));
            html_default.Controls.Add(new LiteralControl("<p>"));               


        }
        Panel2.Controls.Clear();
        Panel2.Controls.Add(html_default);

我需要做什么..

div 不可数...我需要从 div 填充面板。

【问题讨论】：

标签： c# html sql asp.net web

【解决方案1】：

卢丽莎，测试这些代码并在您的 div 中使用：

<style type="text/css">
    #dad{text-align: center;width: 100%;}
       .son{display: inline-block;padding: 0px 5px;border: 1px solid;margin:0 5px;}
</style>
<div id="dad">
    <div class="son">son</div>
    <div class="son">son</div>
    <div class="son">son</div>
    <div class="son">son</div>
    <div class="son">son</div>
</div>

<br />

<div id="dad">
    <div class="son">son</div>
    <div class="son">son</div>
    <div class="son">son</div>
    <div class="son">son</div>
</div>

<br />

<div id="dad">
    <div class="son">son</div>
    <div class="son">son</div>
    <div class="son">son</div>
</div>

【讨论】：