我有这个:
< h1 style="position: relative; top: -103px; left: 700px; border-width: thin; border-style: dotted; border-color: grey;">
< small>Three Stars Of The Week</small>
</p>
它给了我一个带有灰色虚线的标题,该虚线结束于标题末端。它转到页面的末尾。
如何修复它以使边框仅围绕字母,而不是一直到页面末尾?
h1
是一个块级元素,所以这是预期的行为。将其内容放在一个内联元素(例如span
)中并设置样式。
很明显,因为<h>
(标题 1 到 6)标签是块元素,所以它会从页面的开始到结束。尝试使用display:inline-block
. 像这样的东西
你的 CSS 类
.head-class{
position:relative;
top: -103px;
left: 700px;
border-width: thin;
border-style: dotted;
border-color: grey;
display:inline-block; /* style to make element as inline but block */
}
你的元素
< h1 class="head-class"><small>Three Stars Of The Week</small></h1><br>