Resolved Change font size and color for H1 and H2 title tag

[manojgupta26 2]

I tried changing the font size and other characteristics but unable to do so...I would appreciae if you can tell me how can I do it. The font size however was good in earlier version of the theme I bought..

[catrina 103]

You’ll need to use Custom CSS (in Site Options > Custom Code > Custom CSS). CSS that changes the size of text consists of two parts: the selector and the font-size attribute.

Selector: Used to select the kind of text you want to adjust (whether it’s post content or headings).

To find the selector for your text, you'll need to use Firebug (or Chrome Development tools). To learn how to use Firebug for CSS customizations, please read and follow these instructions: http://www.pagelines.com/wiki/Custom_CSS.

For help with the font-size attribute, please see these instructions: http://www.w3schools.com/cssref/pr_font_font-size.asp

[manojgupta26 2]

I tried the following, but doesn't change the fonts

body { font-size: 14px; }

h1 { font-size: 30px; }

h2 { font-size: 24px; }

h3 { font-size: 20px; }

h4 { font-size: 18px; }

[catrina 103]

Your CSS needs to be more specific. For example, for h1, are you looking to change ALL h1 tags or a specific h1 tag?

[manojgupta26 2]

You can visit the site, the H1 and H2 tags on homepage and single posts are too big..even the pages with tag listings or the results pulled out after putting certain keyword in search box.. all are too big. I want to make them appear tidy..

[Rob 547]

Here's an example of why Catrina's saying you need more specific tags or selections for your font size.

This is the default code for titles:

h1, h2, h3, h4, h5, h6, .entry-title, .entry-title a {

    color: #222222;

    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.15);

}

You can see that all the H levels are there in one tag. So, if you did:

h1, h2, h3, h4, h5, h6, .entry-title, .entry-title a {

    color: #222222;

    font-size: 24px;

    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.15);

}

Every single title would be 24px, including those that are now 14px. So, you have to break it down to something like:

h2, .entry-title, .entry-title a {



	color: #222222;

	font-size: 24px;

	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.15);

}

And have one set of code for each size you want.

As for the body, WP doesn't really use a body font since it applies text to sections, Again, you need to find those and apply the size individually, allowing the CSS to affect just that type of section.

[manojgupta26 2]

Thanks! it worked..

[Danny+ 1,327]

The topic was marked as resolved.