First of all, you have to learn to use HTMLs basic coding. So to code with HTML you need to know what elements are. What an element is is it's something that looks like this <p>,or this </p>, this / indicates it's an end tag. One website that might describe it better is W3schools in the element section, but you can just learn all the coding there in the tabs on the left too. So if you wanted to make a paragraph like this one you would type <p>(your text here)</p>. Other things you can also do is heading1 <h1> all the waydown to heading6 <h6> ranging from smallest to biggest, whenever you start an element though you have to end it with a </(element)>. So all of the basic elements are <p> (paragraph),<h1>-<h6> (heading1-heading6), you also need to do <DOCTYPE html>, but this one dosn't need an end tag, that tag just lets the computer know what HTML your doing. You need to do <html> to let the computer know your doing html to and don't forget the end tag </html>. Before you can start a paragraph you need to do <body>, this one needs an end tag. So when your HTML is ready to code it should look like this, you need to space elements out though so it's easier to find them later and it looks neater.
<doctype html> <html> <body> <h1>(your text here)</h1> <p>(your text)</p> </body> <html>
If you want to type HTML into a document to see if you can do it, you can follow the tutorial on W3schools, and then you'll be able to make a short paper to read. To publish this website though I used Neocities they also teach HTML and CSS.
Before I start the basics of CSS you can learn CSS in W3schools. So first off you need to be able to start it off with a tag so you use
<head> and </head> then you want to do <style> and </style>. The style tag shows that you are going to change what text looks like in certain tags like <p> or <h1>. So if
I wanted all the paragraphs (<p>) to be red I would do this.
<head> <style> p{color:red;} </style> </head>
So the way to use CSS is by using three main "text changers" (in my opinion) which are color, font-size, and text-align which are self-explanitory. But if you want to code these you do {} two of these parenthesis a "text changer"=tc then a colon : a value then a semicolon ;. Then if you've done all of those you would have {tc:value;}, like if you want something to appear on the right {text-align:right;}. But that wont actually do anything yet which is what a selector is for. So a selector would be any element that you use for writing, like <h1> or <p>. But you can also specifically do one paragraph, by using para, para1, and para2. But what you would do to use these in something like a paragraph though is you would do <p id="(para-para2)">(your text here)</p>. So to turn your paragraph blue you would do p{color:blue;}, or you would do para{color:blue;} to be selective.
<doctype html> <html> <head> <style> para{color:blue;} </style> </head> <body> <h1>(your text here)</h1> <p id="para">(your text)</p> </body> </html>
So if you look at the example I used para the reason is because if you did p it would do every paragraph instead of just one. Plus if you decided to change all of the paragraphs to para later it would take quite awhile depending on how much you've coded.