Help:Wiki University HTML-- Sizing Fonts

From FamilySearch Wiki
Jump to: navigation, search
MAIN PAGE
WIKI
WIKI MISSIONARY
WIKITEXT
HTML/CSS
FAMILY HISTORY CENTERS
VISUAL EDITOR

Lessons


Flexbox/CSS Grid

Additional Helps

ENLARGING FONTS

Large font.png

Normal size of the default font is about 14px or 14 pixels. Let's say we want to increase the font to 20 pixels. To make the font larger you insert the attribute font-size:20px in the paragraph tag coding:


<p style="font-size:16px">

Here is the paragraph with the enlarged font:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sit amet iaculis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce elementum efficitur faucibus. Curabitur eleifend quis ligula ac ullamcorper. Curabitur eget suscipit turpis.

ENLARGING HEADERS

  • Not only can you enlarge the font in paragraphs, but you can enlarge the font in the headers as well.
  • Use this coding in the opening header tag to enlarge the font in a header:

<h1 style="font-size:20px">Enlarging Headers</h1>

Html7.jpg

When you use the "header tag" <h1> instead of equal signs =, you lose the little edit box to the right of the header. This is sometimes desirable as these little edit boxes can get in the way of other things.


TRY THESE OUT . . . . .

Exercises
  • Enlarge the lorem ipsum paragraph to 20px.
  • Enlarge a header to 36px.


Quick Quiz
  • You cannot enlarge headers
A. True
B. False
  • You can add the "font-size" attribute between the = sign and the words of the header
A. True
B. False


Navigation menu