Oyster506 2021-11-27 15:30 采纳率: 100%
浏览 38
已结题

<span><p>圆角对不齐及圆内数字不居中

img

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            *{
                margin: 0px;
                padding: 0px;
            }
            body{
                background: antiquewhite;
            }
            div{
                width: 300px;
                background-color: white;
            }
            h2{
                background-color: rgb(233,24,90);
                color: white;
                
                font-size: 14px;
                font-weight: 500;
                line-height: 42px;
                padding-left: 5px;
            }
            span{
                font-size: 12px;
                color: white;
                text-align: center;
                font-size: 12px;
                line-height: 6px;
                width: 15px;
                height: 15px;
                box-sizing: border-box;    
                display:inline-block;
                color: white;
                border-style: solid;
                border-width:10px;
                border-color: black;
                border-radius: 50%;
                text-align: center;
                
            }
            p{
                vertical-align:auto;
                font-size: 12px;
                border-bottom-style: dotted;
                border-bottom-width: 1px;
                border-bottom-color: gray;
            }
        </style>
    </head>
    <body>
    <div>
        <h2>大家都喜欢买的美容品</h2>
        <p><span>1</span>&nbsp;&nbsp;雅诗兰黛即时修护眼部精华霜 15ml
        </p>
        <p><span>2</span>
        &nbsp;&nbsp;伊丽莎白雅顿显效复合活肤霜 75ml
        </p>
        <p><span>3</span>
        &nbsp;&nbsp;OLAY玉兰油多效修护霜 50g
        </p>
        <p><span>4</span>
        &nbsp;&nbsp;巨型一号丝瓜水320ML
        </p>
        <p><span>5</span>
        &nbsp;&nbsp;倩碧保湿洁肤水2号 200ml
        </p>
        <p><span>6</span>
        &nbsp;&nbsp;比度克细肤淡印霜 30g
        </p>
        <p><span>7</span>
        &nbsp;&nbsp;兰芝(LANEIGE)夜间修护锁水面膜80ml
        </p>
        <p><span>8</span>
        &nbsp;&nbsp;SK-II护肤精华露215ml
        </p>
        <p><span>9</span>
        &nbsp;&nbsp;欧莱雅青春密码活颜精华肌底液
        </p>
    </div>
    </body>
</html>


  • 写回答

2条回答 默认 最新

  • 你好!机器人 2021-11-27 15:36
    关注

    html发一下
    你可以试下用flex布局
    display:flex;
    align-items: center;//垂直居中
    justify-content: center;//左右居中

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 12月5日
  • 已采纳回答 11月27日
  • 修改了问题 11月27日
  • 创建了问题 11月27日

悬赏问题

  • ¥20 西门子S7-Graph,S7-300,梯形图
  • ¥50 用易语言http 访问不了网页
  • ¥50 safari浏览器fetch提交数据后数据丢失问题
  • ¥15 matlab不知道怎么改,求解答!!
  • ¥15 永磁直线电机的电流环pi调不出来
  • ¥15 用stata实现聚类的代码
  • ¥15 请问paddlehub能支持移动端开发吗?在Android studio上该如何部署?
  • ¥20 docker里部署springboot项目,访问不到扬声器
  • ¥15 netty整合springboot之后自动重连失效
  • ¥15 悬赏!微信开发者工具报错,求帮改