For starters, if you haven't already created a test page, I recommend you create one now using the same theme as your published site. This will let you experiment and help you understand HTML and CSS codes without causing any damage to your published site. If something doesn't work you can delete it and try something else.
I haven't created a child theme, as this is only a test site, so we'll use the Additional CSS in Customize. Never make changes to the theme's parent stylesheet, at worst it may crash your site, at best, if you update the theme, all the changes will be lost, and will have to be done all over again. Unless you have made a copy of them, not an easy task to remember them all.
Now go to your dashboard and add a new page and insert a title for the page. Click on Preview, and in the theme I'm using it looks like this:
Yours will probably look different depending on the theme.
Now we can start to build the page by inserting a H1 Heading. In Visual Editor, click on the circle with the plus sign, Click on Custom HTML and insert the following code, placing your text between the tags:
----------------------------------------------
<h1></h1>
----------------------------------------------
And the Heading should look like this::
There are times when you may need to use a horizontal rule to separate items, so, add another Custom HTML block insert the following code;
---------------------------------------------
<hr>
---------------------------------------------
By default the horizontal rule will be the width of your text area. Purely for illustration purposes, I've placed it under the H1 heading. If you want to reduce the width and center it between items, but retain it full width under your headings, you can do this with some HTML code, for example:
--------------------------------------------
<hr style="width: 30%; margin-left: auto; margin-right: auto;"</hr> and your horizontal rule would look like this:
____________________
--------------------------------------------
Now we can add a paragraph. Open another Custom HTML block and insert the folllowing code:
--------------------------------------------
<p></p>
--------------------------------------------
Add your text between the tags, now preview the page and it should look like this;
Not very impressive is it? So, let's see how we can improve that using CSS.
