A Brief Introduction
This webpage was designed from scratch by Alex Bui.
For this assignment I have decided to make the HTML/CSS cheat sheet alongside the CSS and Personal Blog. As a bonus I have decided to implement a before and after slider for the cheat sheets that you can experiment with below.
For more details on my development process feel free to read the blog.
Thank you for visiting the Geocities version of this page! I will have no way of knowing that you've seen this but I hope it brings a smile to your face.
CHEAT SHEETS
Click me!
HTML CHEAT SHEET
| Tag | Description | Example |
|---|---|---|
| "&"lt; | Less than entity. Remove the " " and it creates the < symbol without triggering the code. | < |
| "&"gt; | Less than entity. Remove the " " and it creates the > symbol without triggering the code. | > |
| <h1> to <h6> | Heading tag. 1 for largest and 6 for smallest. | Heading 4 |
| <p> | Paragraph tag. Used for regular text. | Paragraph |
| <b> | Bolds text. | Bold |
| <i> | Italicizes the text. | Italic |
| <hr> | Creates a horizontal line. | |
| <a> | Creates a hyperlink | Dead Link |
| <sup> | Converts text into superscript. | This is SUPERSCRIPT |
| <sub> | Converts text into subscript. | This is SUBSCRIPT |
CSS CHEAT SHEET
| Tag | Description | Example |
|---|---|---|
| transform | Transform lets you rotate, scale, skew, or translate an element | Rotated Text |
| :hover | Adds hover effects to an element. | Hover over me! |
| border | Creates a border. | Filler Text |
| border-radius | Rounds the border based on a certain percentage. | Filler Text |
| text-align | Aligns the text where you want it to. | Right |
| text-shadow | Adds a drop shadow to the text | Shadow |
| cursor | Changes the cursor depending on where it is. | Hover over me! |
| opacity | Changes the opacity of an element. | Opacity at 0.8 |
| background | Changes the background. | Filler Text |
| background-color | Changes the color of the background. | Filler Text |