Paragraphs, BR, H1's and Style/CSS modifications

132 1 0
                                    


Now you seem experienced enough to learn about making your text, headings and modifications. Exciting!

Within your body chunk, type <p>. Dreamweaver will do the honours of finishing it off with a nice </p>. P obviously stands for paragraph. Now within a paragraph, of course, comes text. This can be whatever you wish. However, within paragraphs, you cannot make a new line unless a <br> is present. BR represents Broken. This breaks the line into its following space below. For example:

<p>Hello there! This is the tutorial on how to learn HTML. <br> This is interesting!</p>
Result:
Hello There! This is the tutorial on how to learn HTML.
This is interesting!

Cool! Now onto headings! Headings are identified through <h1>, however, there are several tiers of headings. <h1>,<h2>,<h3>,<h4> etc. The difference between each heading tier is the size. For every higher integer, the smaller the text goes. Having multiple H1's doesn't make a problem though, this is just for general knowledge. Headings also work the same as the paragraph layout, <h1> test </h1>.  

This next one delves into more complex code. There are two types of modifications, Style and CSS. Style is one that is instantly used within the code and CSS is a different language used with a <css> </css> and is pre-defined. Style is the easiest so I believe it would be best to get that over and done with. The style of style (heh) is used within the arrows of a heading, paragraph etc. Style can modify several things, some of them being color (must be spelt American way in code), font, size, weight etc. This is an example of how it can be conjured:

<p style="font-size: 50px">Hey! This is really big text!<p>
or
<p style="color: blue">Im blue, da ba dee da ba daa</p>
or
<p style="font-family: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif'">This is Gotham font!"</p> [Dreamweaver will help you fill in all this excess stuff that no one knows pfft]
Result:
(I can't do any of the results on here because Wattpad ain't that advanced, so just test it out if you are curious)

Pretty simple, Right? Welp, it's about to get tough. CSS requires you to open a <css> </css>. Within this will be all your CSS code. Now to modify the text you will then have to create a <style> </style> within the CSS. Style is exactly what we just explored earlier but pre-determined, its also global over all of the specified code. Within style you will want to specify the type of code you are modifying, in this instance, it'll be p (paragraph). You will then open a { and hit enter which Dreamweaver will then come in to save the day by adding your very own } a line under. Within these brackets are the styles you want to apply minus the "style=". You can also apply several styles into this chunk. Heres an example:

<css>
   <style>

          p {
               font-size: 30px;
               color: blue; 
               font-family: Gotham, 'Helvetica Neue', Helvetica, Arial, 'sans-serif';
            }

     </style>  
</css>

<body>
<p> Im blue, Gotham, and im really huge. </p>
</body>
Result:
(Once more, cannot apply these, however, im sure you get the point)

That should be that! If you have any problems on this chapter then send me a message!




Basic HTMLWhere stories live. Discover now