Joomla Templates Club 406,261 posts

[thanhlp Friend thanhlpJoin date: October 2008Posts: 18Downloads:0Uploads:1 Thanks: 5 Thanked: 2 times in 1 posts]

#155134

Hi all,

Any people could help me on how to change the font size of the headers on frontpage? The font is ugly and size is too big, I would like to change it to one smoother.

And the background color of menu and the header of modules also, how can I change to another color?

Thanks.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#358543

Hello

Please open the file: /templates/ja_portfolio/css/template.css and find the following code:
Heading:

h1.componentheading, .componentheading {
background: url(../images/noise-bg.png) #313435;
color: #f0f0f3;
padding: 10px 20px;
margin: 0 -20px;
font-size: 125%;
text-transform: uppercase;
font-weight: bold;
}

and

Module:

div.ja-moduletable h3, div.moduletable h3 {
font-size: 125%;
padding: 10px 15px;
color: #f0f0f3;
text-transform: uppercase;
background: url(../images/noise-bg.png) #313435;
}

pls adjust value for the font-size attribute of those blocks

1 user says Thank You to Saguaros for this useful post

1. thanhlp

[thanhlp Friend thanhlpJoin date: October 2008Posts: 18Downloads:0Uploads:1 Thanks: 5 Thanked: 2 times in 1 posts]

#358778

Thanks, can I change h3 to h2 (or h4 if this make the font smaller) instead of change the font size? – sorry for this question but I am very new to CSS!

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#358941

<em>@thanhlp 198250 wrote:</em><blockquote>Thanks, can I change h3 to h2 (or h4 if this make the font smaller) instead of change the font size? – sorry for this question but I am very new to CSS!</blockquote>
now, to make the font is bigger for the h2, or h3, you do as following:

1) Define this class into the template.css file

.myfont{
font-size:150%!important;
}
you can replace 150 by yours number (:))
and then you use this class for that tag

<h2 class=”myfont”> MY CONTENT </h2>

[Author]

Posts