gpt4 book ai didi

css - 如何在标题文本上制作字段集图例样式 "background line"?

转载 作者:技术小花猫 更新时间:2023-10-29 10:22:15 25 4
gpt4 key购买 nike

我正在尝试将标题文本设置为与您的 default legend text 相似的样式出现在字段集中;也就是说,我想要一条类似删除线的线出现在文本上,而不是穿过文本。我似乎找不到任何关于如何完成此任务的信息,而且由于 Google 总是将我引导到 Stack Overflow 寻求答案,因此我认为这里有人可能会给我建议。

为了更清楚。我正在尝试对标题文本产生这种效果:

居中标题文本

有什么办法吗?

最佳答案

参见: http://jsfiddle.net/thirtydot/jm4VQ/

如果文本需要换行,这将不起作用。在 IE7 中,不会有行。

HTML:

<h2><span>Centered Header Text</span></h2>

CSS:

h2 {
text-align: center;
display: table;
width: 100%;
}
h2 > span, h2:before, h2:after {
display: table-cell;
}
h2:before, h2:after {
background: url(http://dummyimage.com/2x1/f0f/fff&text=+) repeat-x center;
width: 50%;
content: ' ';
}
h2 > span {
white-space: nowrap;
padding: 0 9px;
}

关于css - 如何在标题文本上制作字段集图例样式 "background line"?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5985009/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com