CSS, which stands for Cascading Style Sheets, is a style sheet language that is used to describe how contents of a website should visually be seen. For example, if you wanted to make the background color of the menu of a website a certain color, you could you CSS to alter the color to your choosing. Just like HTML, there are tons and tons of different codes in CSS to make edits to the visual aspect of a website. In order to make these edits, you are going to need to learn some basic knowledge about CSS. First off, you can’t just write in random code and expect the changes to be made on the spot. You need to narrow down where you want that code to work, so you don’t end up changing colors or font styles of the wrong areas of your website. To narrow down CSS coding there are terms that you should familiarize yourself with to ensure proper code input. There is a hierarchy within code of where each element of a website resides. If you wanted to change one menu item on a menu bar then the code would be something around the lines of <id=”main-menu ” class=”block 1″…>. The id is the menu bar, representing the overall location, and the class represents the specific element within that overall location. The class can then have certain links to go to different areas of the website and what not.
In CSS these are represented as follows:
- ID = #
- Class = .
- Link = a
When making edits in CSS , a declaration block is used to list out the certain changes you want to make to certain elements. You would start the block by using a brace { then write the edit using a colon: to separate the action going to be done and what you want it to do , then end the line with a semi-colon; if there is going to be multiple edits to that element.
To change the color and font size of the specific menu item on the bar, you would write the code:
#main-menu > .block1
{
background – color: red;
font-size: larger
}
The hashtag tells you where the element is located. The greater than sign tells you that the edit is going to be made further down and the period tells you what class or what element is being changed. Knowing this basic knowledge of CSS is a great way to make simple edits to websites to make them aesthetically pleasing to a user’s eye.