How can I change the border width and height so it wraps around the text?

问题

I have the following webpage:

Here is my code:

When creating a header, does the border width tag go inside the <h1> tag or in a separate tag? I'm trying to make the border wrap around the header text in the middle of the page, instead of stretching to either side.

回答1:

Use padding and display:inline-block; on a span tag.

OR do it like this:

span {
    padding: 10px;
    border: 5px solid black;
    display: inline-block;
}

<span>Is this long enough? Is this long enough? Is this long enough? Is this long enough? Is this long enough? Is this long enough? Is this long enough? Is this long enough? Is this long enough? Is this long enough? </span>

回答2:

You can set the border-width like this:

<h1 style="border: 4px solid black;"></h1>

That is, if it's the header that is having the border styling, if it's another tag then you make that change there instead.

来源：https://stackoverflow.com/questions/65366486/how-can-i-change-the-border-width-and-height-so-it-wraps-around-the-text