h1、h2、h3 标题中的粗体字 - 92590
Posted
技术标签:
【中文标题】h1、h2、h3 标题中的粗体字 - 92590【英文标题】:Bold font in h1, h2, h3 titles - 92590 【发布时间】:2012-09-17 11:20:18 【问题描述】:我需要帮助来了解如何在 WordPress 的优雅主题中获得粗体字体,但仅限于标题区域(h1、h2、h3 等),因为在文本正文中获取它没有问题。
我已经尝试过了,即使在编辑器中我得到了粗体标题,但一旦我发布了页面,情况就不是这样了,无论我做了什么更改。
我包含了代码(不是完整的,而是重要的部分)——“h1”区域中的任何更改都不会在发布后得到反映,甚至字体类型也不会反映,除了大小。我不是编码员,所以也许我缺少一些东西。请帮忙:
/*------------------------------------------------*/
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
body line-height: 1;
ol, ul list-style: none;
blockquote, q quotes: none;
blockquote:before, blockquote:after,q:before, q:after content: ''; content: none;
/* remember to define focus styles! */
:focus outline: 0;
/* remember to highlight inserts somehow! */
ins text-decoration: none;
del text-decoration: line-through;
/* tables still need 'cellspacing="0"' in the markup */
table border-collapse: collapse; border-spacing: 0;
/*------------------------------------------------*/
/*-----------------[BASIC STYLES]-----------------*/
/*------------------------------------------------*/
body line-height: 18px; font-family: 'Droid Sans', Arial, sans-serif; font-size: 15px; color: black; text-shadow: 1px 1px 1px #ffffff; background-color: #15191f;
a text-decoration: none; color: #00b7f3;
a:hover text-decoration: underline;
.clear clear: both;
.ui-tabs-hide display: none;
br.clear margin: 0px; padding: 0px;
h1, h2, h3, h4, h5, h6 padding-bottom: 5px; color: #111; letter-spacing: -1px; line-height: 1em; font-weight: bold;
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a color: #111;
h1 font-size: 30px; font-weight: bold; font-family:"Times New Roman", Times, serif;
h2 font-size: 24px;
h3 font-size: 22px;
h4 font-size: 18px;
h5 font-size: 16px;
h6 font-size: 14px;
p padding-bottom: 10px; line-height: 18px;
strong font-weight: bold; color: #1c1c1c;
cite, em, i font-style: italic;
pre, code font-family: Courier New, monospace; margin-bottom: 10px;
ins text-decoration: none;
sup, sub height: 0; line-height: 1; position: relative; vertical-align: baseline;
sup bottom: 0.8em;
sub top: 0.3em;
dl margin: 0 0 1.5em 0;
dl dt font-weight: bold;
dd margin-left: 1.5em;
blockquote margin: 1.5em; padding: 1em; color: #666666; background: #e6e6e6; font-style: italic; border: 1px solid #dcdcdc;
blockquote p padding-bottom: 0px;
input[type=text],input.text, input.title, textarea, select background-color:#fff; border:1px solid #bbb; padding: 2px; color: #4e4e4e;
input[type=text]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus border-color:#2D3940; color: #3e3e3e;
input[type=text], input.text, input.title, textarea, select margin:0.5em 0;
textarea padding: 4px;
img#about-image float: left; margin: 3px 8px 8px 0px;
.clearfix:after visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;
* html .clearfix zoom: 1; /* IE6 */
*:first-child+html .clearfix zoom: 1; /* IE7 */
/*------------------------------------------------*/
/*---------------[MAIN LAYOUT INFO]---------------*/
/*------------------------------------------------*/
#top background: url(images/top-bg.png) repeat-x;
#top-wrapper background: url(images/top-wrapper-bg.jpg) no-repeat top center;
#top-content background: url(images/top-content-bg.png) repeat-x bottom left;
#bottom-light background: url(images/bottom-light-bg.png) no-repeat bottom center;
.container text-align: left; margin: 0 auto; width: 960px; position: relative;
#top .container padding-bottom: 60px;
#logo margin: 65px 13px 35px;
#menu background: url(images/left-menu-bg.png) no-repeat top left; padding-left: 11px; height: 49px;
#menu-right background: url(images/right-menu-bg.png) no-repeat top right; padding-right: 11px; height: 49px;
#menu-content background: url(images/content-menu-bg.png) repeat-x; height: 49px;
#social-icons float: right; margin-right:23px; margin-top: 17px;
#social-icons a padding-left:4px;
#content background: url(images/content-bg.png); border-top: 1px solid #ffffff;
#content-shadow background: url(images/content-shadow-bg.png) repeat-x top left; padding-top: 70px; padding-bottom: 37px;
#services margin-bottom: 40px;
.service margin-right: 45px; width: 238px; float:left; position:relative; padding-left: 52px;
.last margin-right: 0px;
img.icon position:absolute; top: 0px; left: 0px;
.service h3.title font-size: 24px; margin-bottom: 8px; color: #1f262d;
.service p line-height: 21px;
.service a.readmore background:url(images/readmore.png) no-repeat right bottom; color:#1c2329; display:block; font-size:11px; height:24px; line-height:24px; padding-right:10px; text-shadow:1px 1px 1px #ffffff; display:block; float:right;
.service a.readmore span background:url(images/readmore.png) no-repeat;
display:block; height:24px; padding-left: 12px; padding-right: 2px;
.service a.readmore:hover color: #000;
【问题讨论】:
发布指向实际博客的链接。您是否正在保存更改?你是如何编辑 CSS 文件的? 通常最好转到外观 > 主题选项 > 设计并输入您的自定义 CSS 发布链接,以便我们查看博客。有可能添加的其他样式表可能会覆盖您的样式。 【参考方案1】:试试 CSS font-weight 属性值:
h1, h2, h3, h4, h5, h6
font-weight:100;
您可以从100, 200, 300, 400, 500, 600, 700, 800 to 900.
调整值。900
的属性值最粗,100
最轻。
【讨论】:
值得一提的是,许多字体并不支持所有 9 种不同的权重值。对于font-weight: bold;
,相当于使用font-weight: 700
。【参考方案2】:
尝试添加
h1
font-weight: bold;
到您的外部 css 文件,或替换您的
<h1> your text here </h1>
与
<h1 style="font-weight: bold"> your text here </h1>
【讨论】:
是的,h1 字体粗细:粗体;工作!但是font-weight
的值 100, 200, 300, 400, 500, 600, 700, 800 to 900
对标题标签不起作用(可能不再起作用,它曾经是)。
在这里做一些实验:w3schools.com/cs-s-ref/tryit.asp?filename=trycss_font-weight - 在正文 html 和 CSS 中将其中一个 更改为
,然后更改字体大小。似乎最大值为 600,但较低的值仍然有效。
以上是关于h1、h2、h3 标题中的粗体字 - 92590的主要内容,如果未能解决你的问题,请参考以下文章