在html中绘制线条

如何在Html中绘制类似的内容

---

您可以使用以下内容：

#leftbox{
浮动：左；
边缘顶部：65px；
右边距：10px；
} 
#右框{
浮动：对；
边际上限：0px；
左边距：0px；
}     
#中间箱{
浮动：左；
右边距：0px；
} 
测试
测试

然而，在您的情况下，为其网格系统使用bootstrap并方便地指定和定位div将更符合逻辑。请参见网格系统的链接：

---

谢谢您的回答，但我如何能够并排显示行和文本呢？欢迎来到Stack Overflow！要改善你的体验，请阅读一个问题。您还应该查看和。要进一步了解堆栈溢出的工作原理，请。

#leftbox { 
    float:left;
    margin-top:65px;
    margin-right: 10px;
            } 
#rightbox{ 
    float:right; 
    margin-top:0px;
    margin-left:0px;
            }     
#middlebox{ 
    float:left;   
    margin-right:0px;
            } 

<div id = "leftbox"> 
<h2>TESTTESTTEST </h2> </div>

<div>

</div id = "middlebox">
    <svg height="210">
       <line x1="0" y1="100" x2="200" y2="100" style="stroke:rgb(0,0,0);stroke-width:2" />
       <line x1="200" y1="50" x2="200" y2="150" style="stroke:rgb(0,0,0);stroke-width:2" />
       <line x1="200" y1="50" x2="300" y2="50" style="stroke:rgb(0,0,0);stroke-width:2" />
       <line x1="200" y1="150" x2="300" y2="150" style="stroke:rgb(0,0,0);stroke-width:2" />
    </svg>
    </div>

    <div id = "rightbox"> 
    <h2>TESTTESTTEST </h2> </div>
    </div>