web_design:letter:headings
Differences
This shows you the differences between two versions of the page.
| Next revision | Previous revision | ||
|
web_design:letter:headings [2021/10/04 17:21] mag created |
web_design:letter:headings [2023/08/16 09:33] (current) |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| ====== Web Development ====== | ====== Web Development ====== | ||
| - | ===== Lesson | + | ===== Lesson |
| - | ==== Headings ==== | + | ===== Headings |
| + | We'll continue to use the code you've been working on in [[https:// | ||
| + | < | ||
| + | <p style=" | ||
| + | < | ||
| + | < | ||
| + | <p style=" | ||
| + | < | ||
| + | < | ||
| + | <p>Me encuentro en alta disposición para conversar con ustedes más ampliamente. Espero su llamado para una entrevista y conocernos mejor.</ | ||
| + | < | ||
| + | < | ||
| + | * Headings can also be defined using html tags. Let's add a heading above the first line | ||
| + | < | ||
| + | * Notice that the text is much bigger and heavier, as you'd expect from a heading. | ||
| + | * There are 6 levels of heading from < | ||
| + | ==== Font-family ==== | ||
| + | |||
| + | * Let's make some changes to the heading style. | ||
| + | * Change the font by adding a font-family style attribute. | ||
| + | < | ||
| + | * Now make it green. | ||
| + | < | ||
| + | |||
| + | ==== Font-size ==== | ||
| + | |||
| + | * Next, let's make it smaller. | ||
| + | < | ||
| + | * The < | ||
| + | |||
| + | ==== Underline ==== | ||
| + | |||
| + | * Let's underline the heading. | ||
| + | < | ||
| + | |||
| + | ==== Changing Case ==== | ||
| + | |||
| + | * Let's make it all upper case. | ||
| + | < | ||
| + | * Here's a different style that looks great in headings. Notice that you need to delete < | ||
| + | < | ||
| + | |||
| + | ==== Line Height ==== | ||
| + | |||
| + | * We can also change the height of the line. | ||
| + | < | ||
| + | * Did you notice the extra space above the heading now? That's because the line height is bigger than before. | ||
| + | |||
| + | ==== Shadow ==== | ||
| + | |||
| + | * Finally, let's add some shadow to the heading. | ||
| + | < | ||
| + | * See how you can string many style attributes together? | ||
| + | * This is handy if you want to change the style of one element, but becomes cumbersome if, for example, you want to change the style of all paragraphs in your letter. For that, we'll use CSS, which we'll cover in Lesson 3. | ||
| + | * All the style attributes we've used in this lesson can be used in CSS. | ||
| + | |||
| + | [[web_design: | ||
web_design/letter/headings.1633393283.txt.gz · Last modified: 2023/08/16 09:33 (external edit)
Page Tools
Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
