<fieldset>标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>CSS控制文字在一条线的中间</title>
    <style type="text/css">
* {
font-size:12px;
margin:0;
padding:0; 
} 
fieldset {
padding:10px;
margin:10px;
width:150px;
color:#333; 
border:#06c dashed 1px;
} 
legend {
color:#06c;
font-weight:800; 
background:#fff;
} 
ul {
list-style-type: none;
margin:8px 0 4px 0;
} 
li {
margin-top:4px;
}
</style>
</head>
<body>
<fieldset style="float: left"> 
    <legend>A相</legend>
    <ul>
        <li>
            I:10A
        </li>
        <li>
            U:10V
        </li>
        <li>
            P:10KW
        </li>
    </ul> 
</fieldset>
<fieldset style="float: left"> 
    <legend>B相</legend> 
    <ul>
        <li>
            I:10A
        </li>
        <li>
            U:10V
        </li>
        <li>
            P:10KW
        </li>
    </ul>
</fieldset>
<fieldset style="float: left"> 
    <legend>C相</legend> 
    <ul>
        <li>
            I:10A
        </li>
        <li>
            U:10V
        </li>
        <li>
            P:10KW
        </li>
    </ul>
</fieldset>
<fieldset style="float: left"> 
    <legend>汇总</legend> 
    <ul>
        <li>
            I:10A
        </li>
        <li>
            U:10V
        </li>
        <li>
            P:10KW
        </li>
    </ul>
</fieldset>
    
</body>
</html>

CSS控制文字在一条线的中间

A相
  • I:10A
  • U:10V
  • P:10KW
B相
  • I:10A
  • U:10V
  • P:10KW
C相
  • I:10A
  • U:10V
  • P:10KW
【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/WebApp-DotNet/p/6378197.html