Image from wallpapercave.com

CSS
The hardist part some times

where the color and all text text move

Home Interests html CSS
CSS
Color to the size of text it all happens in the style sheet
it can be hard to get thing right but with using the inspect element
you can play around with how things look and how they interract with
each other and to make sure thing look perfect

Selectors

Selectors are used to target certain elements or groups of elements or even one type of element in its entirety. Selctors can also be given certain criteria that has to be meet to affecte that certain element allowing for element to one thing then another with a few lines of code

ID Selector can only be put on one AND ONLY ONE element and is done like this

#ID h1

Class selctor are use to target a general area and are usually used in div elements and can be used as many times as needed


.ThisIsAClass

Universal selectors on the other hand target everything in the style sheet making it usfull to get ride of margin or padding on all elemnts.


* done like this

A few other are the child (h1 > p), adjacent (h2 + div), and the :nth-child() selector.

Display

Display are use to change the orientation of elements in side of the display. they can range from blocks, to grid to flex displays which has there own way of changing how they move to how big the display is. Generally the block is the most use one as it allows you to everything you need in to a easy to move and manipulate diplay

Block is always a good one to use to move generalize elements like text or images.

But both inline and inline block are great if you need thing to line up in one line

some or displays are none with make that element disapper, flex which allows for many different changes to happen and visibility which with some conditions can make elements be deen of vanish but still take up the space is was in.

Positioning

Positioning changes how the element interacts with other element on the page. From making so other element can sit in it to making follow the screen as it moves. Positioning also allows you to move elements around as well so you can move them to just right spot.

Absolute positioning makes it so the element can move into other element without changing the other element. This can be used to put images ontop of other images or text over said images

sticky positioning makes it so that after you where supposed to scroll pass an element, the element will stick to the top of your page and stay on the top of the screen until you return to is original position.

A few others are the fixed will stay in one place and the content will even go over top of it as well, and the static which is just the default of all elements.