无敌火车滴滴开 2023-04-10 00:08 采纳率: 57.1%
浏览 17
已结题

关于text-indent问题

img


1.为什么text-indent不能移动文字的内容?
2.使用text-indent会导致文字反方向偏移,而且弹性盒的间距也会变。什么情况.

  • 写回答

1条回答 默认 最新

  • 白云苍狗い 2023-04-10 08:13
    关注

    您好,text-indent属性是用来设置首行缩进的.顾名思义会在您的文字前面加上对应px的空白,看您的给的是一个负数px,所以等于减去这部分空白,由于你设置了flex所以整个元素会往前偏移.
    下面模拟您的情况 分别设置正数和负数 您参考一下

    <style>
      * {
        margin: 0;
        padding: 0;
      }
    
      .main {
        display: flex;
        width: 100px;
        background-color: aqua;
      }
    
      .main div {
        width: 20px;
        background-color: blue;
      }
    
      .main a {
        /* display: inline-block; */
        text-indent: 15px;
      }
    </style>
    
    <body>
      <div class="main">
        <div>图标</div>
        <a href="">你好呀</a>
      </div>
    </body>
    

    img

    <style>
    * {
        margin: 0;
        padding: 0;
      }
    
      .main {
        display: flex;
        width: 100px;
        background-color: aqua;
      }
    
      .main div {
        width: 20px;
        background-color: blue;
      }
    
      .main a {
        /* display: inline-block; */
        text-indent: -15px;
      }
    </style>
    
    <body>
      <div class="main">
        <div>图标</div>
        <a href="">你好呀</a>
      </div>
    </body>
    
    

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录

报告相同问题?

问题事件

  • 系统已结题 4月21日
  • 已采纳回答 4月13日
  • 创建了问题 4月10日

悬赏问题

  • ¥15 永磁直线电机的电流环pi调不出来
  • ¥15 用stata实现聚类的代码
  • ¥15 请问paddlehub能支持移动端开发吗?在Android studio上该如何部署?
  • ¥20 docker里部署springboot项目,访问不到扬声器
  • ¥15 netty整合springboot之后自动重连失效
  • ¥15 悬赏!微信开发者工具报错,求帮改
  • ¥20 wireshark抓不到vlan
  • ¥20 关于#stm32#的问题:需要指导自动酸碱滴定仪的原理图程序代码及仿真
  • ¥20 设计一款异域新娘的视频相亲软件需要哪些技术支持
  • ¥15 stata安慰剂检验作图但是真实值不出现在图上