'how to remove the bold from a headline?

I have a headline:

<h1>THIS IS A HEADLINE</h1>

How do i make the phrase "THIS IS..." not to be bold and the rest without a change? couldn't find any relevent tag in text-decoration.

cssxhtml


Solution 1:[1]

The heading looks bold because of its large size, if you have applied bold or want to change behaviour, you can do:

h1 { font-weight:normal; }

More: http://www.w3.org/TR/css3-fonts/#font-weight-prop

Solution 2:[2]

Try font-weight:normal;

h1 {
    font-weight: normal;
}

Solution 3:[3]

<h1><span style="font-weight:bold;">THIS IS</span> A HEADLINE</h1>

But be sure that h1 is marked with

font-weight:normal;

You can also set the style with a id or class attribute.

Solution 4:[4]

You want font-weight, not text-decoration (along with suitable additional markup, such as <em> or <span>, so you can apply different styling to different parts of the heading)

Solution 5:[5]

style is accordingly vis css. An example

<h1 class="mynotsoboldtitle">Im not bold</h1>
<style>
.mynotsoboldtitle { font-weight:normal; }
</style>

Solution 6:[6]

<h1><span>This is</span> a Headline</h1>

h1 { font-weight: normal; text-transform: uppercase; }
h1 span { font-weight: bold; }

I'm not sure if it was just for the sake of showing us, but as a side note, you should always set uppercase text with CSS :)

Solution 7:[7]

for "THIS IS" not to be bold - add <span></span> around the text

<h1>><span>THIS IS</span> A HEADLINE</h1>

and in style

h1 span{font-weight:normal}

Solution 8:[8]

you can simply do like that in the html part:

<span>Heading Text</span>

and in the css you can make it as an h1 block using display:

span{
display:block;
font-size:20px;
}

you will get it as a h1 without bold ,
if you want it bold just add this to the css:

font-weight:bold;

Solution 9:[9]

You can use font-weight:100 or lighter: this is working with i.e. Opera 16 and older, but I do not know why the h1 tags in Firefox are bolder, sorry.

Solution 10:[10]

If you want to remove the bold, you can use the code below,

h1 {
    font-weight: normal;
}

but for "THIS IS" not to be bold, add <span></span> around the text,

<h1><span>THIS IS</span> A HEADLINE</h1>

and in style,

h1 span{
        font-weight:normal;
}

Code example result,

h1 span{
        font-weight:normal;
}
<h1><span>THIS IS</span> A HEADLINE</h1>

Related Questions