HTML is the language of a web page, it determines what you have to display. It is used together with css, which is how to display it. Formatting and styles are css. And what it does is determined by javascript, a complete programming language. All three of those together and you can make a web page that looks like or can do anything. This is known as the front end.
There is also a back end which is the web server. There are many ways to transmit or serve a web page to a browser. It can accept form elements and other input too from pages using http or https. There is a protocol called CGI which connects a web server to an external program using environment variables. I'm using that with lua. Lua can use a database like sqlite to save and restore data.
header to use to make mobile scaling and specify unicode character set:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
Use <!doctype html> to select standards mode and not quirks mode
Quirks mode is the layout mode that exists to help with backwards compatibility, if you leave that mode it will imitate browsers behavior before they were standardized. If you set it to standards mode it will be more predictable and look the same on different browsers that conform to the standards. A good idea to always remember this.
to link in css:
<link rel="stylesheet" href="reminder.css">
html entities:
less than sign - < <
greater than sign - > >
and sign - & &
single quote - ' '
double quote - " "
left smart quote - “ “
right smart quote - ” ”
right smart single quote - ’ ’
non breaking space -
decimal code - " "
simple formatting (use css for most other formatting)
<b> bold </b>
<i> italics <i>
<u> underline <u>
<center> centered </center> - should use inline style for that, <div style="text-align: center">centered</div>
image - <img src="/img/faerie4.jpg">
audio - <audio controls src="/img/Three%20Chain%20Links%20%96%20Die%20Historic%20%2DSynthwave%2D%2Emp3"></audio>
The audio was provided by https://royaltyfreeplanet.com and somewhere on that page it asks to be attributed to use their music so there.
link - <a href="http://kandyneko.com">My web site</a> My web site
<p>Paragraph</p> - it makes a block
line break <br>
<div>Div</div> - div makes it a block
<span>span</span> - set up an inline style that doesn't block.
<pre>Preformatted text</pre>
spaces can show in between these tags and the text is mono spaced. It makes a block.
url
http://kandyneko.com/pages/index.lua#anchor?filename=main&css=1
http:// - protocol
kandyneko.com - site (if you leave off protocol and site, it's the current site)
/pages/ - path (if you don't begin with a / it's relative to the path you are at.)
index.lua - page name (can even omit this if the server assumes a page name like index.html or index.lua)
#anchor - a place in the page marked with <a name="anchor">
?filename=main - field name and value used with get form method
&css=1 - additional field names and values with get form method
special characters should be encoded with hex such as %20 for space
unordered list
<ul>
<li> Point </li>
<li> Point </li>
<li> Point </li>
</ul>
body tag or other tag can have contentEditable attribute set to allow you to edit it
Example (in <code> tags, a style element that does not block)
<!doctype html>
<html>
<head>
<title>Example page</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="sortable.js"></script>
<style>
p {
text-indent: 2in;
}
</style>
<body>
<p>Hello, it's my page.</p>
<form name="form_name" action="form-page.lua" method="post">
<input name="field1"> Thing </input>
<textarea name="text1" rows=40 cols=80> Some stuff in a text area </textarea>
<input type="submit" value="Submit"></input>
<input type="button" id="button1" value="Do Script" onclick="dosomething()" class="my_button"></input>
</form>
