The core language of the web! it uses angle brackets (< >) for its tags
this list isn't exhaustive but this should be a good starting point!
<h1> through <h6>Headings! The number means a different level of the heading, typically gets smaller the bigger the number, use in order!
<b>, <i>, <u>bold, italic, underline, respectively
<p>paragraph, use for main body text!
<img>for pictures! put the image link in the src property
Like this!
<img src="https://files.catbox.moe/mfolya.png"/>
<style>Where you put CSS code!
<hr>draws a horizon
<span>Wrapper for styling a specific part of text, has no visual change, typically used with CSS to style a very specific part of a paragraph
<mark>:Highlight text
<video> and <audio>:embed videos/audio!
put the link to the media in the src property! only works on media files uploaded to something like Catbox. Remember to add the controls property or else there won't be any buttons (and for an audio, it will be invisible)
Example!
<video controls src="https://files.catbox.moe/gh1gx1.mp4"/>
<audio controls src="https://files.catbox.moe/b9tro0.mp3"/>
Other parameters for medias:
loop: Make a media loop on finish
autoplay: autoplays a media with sound muted (audios just wont play, it will be paused, video does play but is muted) in most circumstances, but in some cases (see below), will autoplay with sound!
Autoplay cases: (adapted from mdn)
- The audio is muted or its volume is set to 0
- The user has interacted with the site (by clicking, tapping, pressing keys, etc.) (this only applies to scripted audio using javascript but thats beyond this guide)
- If the site has been allowed to autoplay in browser settings
All elements except img,video,audio,hr must be closed with their closing variant (ex: for a p, </p>) so the browser knows when that is done (also, they must surround the text / content they apply to)
HTML resource: W3Schools HTML tutorial (w3schools is how i learnt this stuff years ago)
im not writing this one tonight hell no
still not writing this today
not writing it today either aa
go go gadget W3Schools css tutorial
you dont need to learn css grid or flexbox for basic sites
tbh avoid them like the plague they (flexbox and grid) suck
literally just an 88 x 31 pixels image! i would reccomend disabling antialiasing for text, although it's a bit complicated depending on some softwares, jspaint makes it easy tho, its a clone of old microsoft paint from like windows 98
you'll also want to follow the guide to disable antialiasing below!
web browsers also like to anti alias images (this is more obvious if a user zooms in), the only way to disable it is with some custom css
*{
image-rendering:pixelated;
}
.noAA{
image-rendering:pixelated;
}
then on any image you want antialiasing removed from you just add the property class="noAA", if it already has a class property, just add noAA to the end, like this class="example noAA"
Both of these tricks work on anything else with images, if its a background, or even videos (i think at least, havent tried)