问div标签边框中的文本
EN

Stack Overflow用户

提问于 2017-03-07 14:52:03

回答 1查看 2.6K关注 0票数 0

我知道这是一个老问题，但我想知道将文本放入div标记边框的最佳方法是什么。这就是我的东西

.componentWrapper {
  border: solid cadetblue;
  border-radius: 40px;
  padding: 10px;
  width: 95%;
}

<div class='componentWrapper'>Text inside div </div>

我想在div标签的边框中添加一个标题。我知道一种选择是使用字段集，但我不喜欢使用这种方法。另一种方法是放置一个框并将其向上移动并设置背景颜色，但我认为当您在页面上设置不同的背景颜色时，此方法将失败。

对此最好的解决方案是什么？

css

border

回答 1

Stack Overflow用户

发布于 2017-03-08 21:15:22

我建议使用position:absolute进行类似的操作

.componentWrapper {
  border: solid cadetblue;
  border-radius: 40px;
  padding: 15px 10px 10px;
  width: 95%;
}

.componentWrapper .header {
  position:absolute;
  margin-top:-25px;
  margin-left:10px;
  color:white;
  background:cadetblue;
  border-radius:10px;
  padding:2px 10px;
}

<div class='componentWrapper'><div class="header">Headline</div>Text inside div </div>

票数 5

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/42641989

复制

相似问题

问div标签边框中的文本
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问div标签边框中的文本EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问div标签边框中的文本
EN