search

Home  >  Q&A  >  body text

css3 - border-bottom 的长度可否超过盒子的宽度呢?实现如下图效果。(我的书下面的线)

PHPzPHPz2778 days ago784

reply all(7)I'll reply

  • PHPz

    PHPz2017-04-17 11:44:59

    I set the margin to a negative value and then set the padding to a positive value.

    reply
    0
  • 迷茫

    迷茫2017-04-17 11:44:59

    What the poster said is to add bordr-bottom to the outer layer of "My Book"

    reply
    0
  • 大家讲道理

    大家讲道理2017-04-17 11:44:59

    Logically speaking, it shouldn’t be possible~ because the length of the border itself seems to be the same as the length of the box~ If it is really longer than the box, you can nest a p outside. This is just my personal opinion. If there is anything wrong, please correct me. Thank you.

    reply
    0
  • ringa_lee

    ringa_lee2017-04-17 11:44:59

    No, your border-bottom is added inside the box

    reply
    0
  • 高洛峰

    高洛峰2017-04-17 11:44:59

    Set a margin value to a negative value

    reply
    0
  • 怪我咯

    怪我咯2017-04-17 11:44:59

    I just tried the 1L and 5L methods and set a negative value for margin, but it didn’t work. In my understanding, the border corresponds to the actual width and height of the block element. The margin attribute can only adjust the position and cannot increase the width and height of the element. So if you want to keep the width of p at 50px, you still want this The border-bottom of p has a length of 100px, which is impossible to achieve, right? I don’t know if my understanding is correct. I’m a css novice. Comments are welcome.
    In addition, I think the 2L and 3L methods are possible. I also implemented it this way during the development process. It is currently the simplest and most direct implementation method I know. If there are other better methods, please welcome your guidance!

    reply
    0
  • PHP中文网

    PHP中文网2017-04-17 11:44:59

    Hey, I read it several times and can’t understand what it means. How can you understand it? What I barely understand means: the width of the horizontal gray line is greater than the width of the horizontal blue line, and it needs to break through the blue line to get out, right? Wouldn't it be nice if the inside box was wider than the outside box? . . Isn’t the border-bottom of the inner box larger than the outer box frame? I feel like I didn’t understand it. . .

    reply
    0
  • Cancelreply