HTML 脚本文本对齐/边框答案

【问题标题】：HTML script text align/ borderHTML 脚本文本对齐/边框
【发布时间】：2021-06-11 05:15:15
【问题描述】：

我必须编写这个 HTML 脚本。如您所见，我编写了代码，但布局不同。有人可以帮我吗？

问题：

这是我的输出：

代码：

<! DOCTYPE Html>
<html>
<head><title>example2</title></head>
   <body>
   <h3 style="border-style: solid; width: 5%; text-align: top-center; float: center;"> YUCW</h3>
 
      <p style="text-align:left; border-bottom-style: solid;">
    MIS 343
    <span style="float:right;">
       principles of e-commerce
         <p style="text-align:left; border-bottom-style: solid;">
    Name: <i>Riyam</i>
    <span style="float:right;">
       midterm marks 24/25
        
    </span>
</p>

<p style="text-align:left;">
    Specialization : <i > MIS</i>
    <span style="float:right;">
      final marks 32/35
        
    </span>
</p>
   </body>
</html>

【问题讨论】：

非常感谢，如果可以的话，没有 div 怎么办，因为我还没拿。非常感谢

标签： html css border text-align script

【解决方案1】：

有很多方法可以做到这一点

<body> 
        <p style="text-align: center;width: 40vw;float: left;margin-left: auto;">
             <span style="display: block;border-bottom-style: solid;">MIS 343</span><br>
             <span style="border-bottom-style: solid;display: block;">Name : Riyam</span><br>
             <span>Specialization : MIS</span>
        </p>
        
        <h3 style="margin: 0;width: 5%;display: flex;justify-content: center;height: 100px;border-style: solid;padding: 0;float: left;align-items: center;"> YUCW</h3>
        
        <p style="text-align: center;width: 40vw;float: left;display: inline;">
             <span style="display: block;border-bottom-style: solid;">principles of e-commerce</span><br>
             <span style="display: block;border-bottom-style: solid;">midterm marks 24/25</span><br>
             <span>final marks 32/35</span>
        </p>     
</body>

【讨论】：

【解决方案2】：

<body>
<div style="display:flex;justify-content:center;">
 <div style="text-align: center;flex-grow: 1;">
    <p style="border-bottom-style: solid;">
    MIS 343
    </p>
    <p style="border-bottom-style: solid;">
    Name : Riyam
    </p>
    <p>
    Specialization : MIS
    </p>
 </div>
    <h3 style="border-style: solid;width: 5%;display: flex;align-items:center;justify-content: center;"> YUCW</h3>
 <div style="text-align: center;flex-grow: 1;">
    <p style="border-bottom-style: solid;">
    principles of e-commerce
    </p>
    <p style="border-bottom-style: solid;">
    midterm marks 24/25
    </p>
    <p>
    final marks 32/35
    </p>
  </div>
</div>    
</body>

【讨论】：

非常感谢。如果你能帮助我更多，我怎么能没有 div，因为我还没有接受它。非常感谢