SASS is a tool that allows you to write & organize CSS more precisely & very easily. And SCSS is an extension of SASS. For example- style.scss, _header.scss, _footer.scss, and so on and so forth. On the other hand, CSS refers to ‘Cascading Style Sheets‘ that are executable by web browsers. Note: CSS is not a programming language, it’s a stylesheet language. In this post, I will show you how you can configure (set up) your VSCode editor for using SASS/SCSS. Also, I will explain & distinguish between SASS & CSS. Last but not least, I will also give you […]
Read More →Use the color property to change the font color. You can use Hex, RGB, RGBA, CMYK, and the name of any color. To change an element’s font color to blue, write color: blue for the element. You can target the element by CSS class name, ID, and even by tag name. If it’s a paragraph or <p> tag, then your CSS should be p{color: blue} If it’s a certain element that has a CSS class of “apple” then your CSS will be .apple {color: blue} And if it has a CSS ID of “burger“, the CSS code will be #burger […]
Read More →CSS word-wrap property allows you to break the long word into the next line. Words within a paragraph automatically break to the next lines when necessary. But if you have a word with 50 characters/letters, that may cause a horizontal scrollbar. And it may go over/outside of the body. To solve this kind of problem, the word-wrap property comes into play. See the following example: In the above example- both contain the same HTML: And the following CSS solved the issue: CSS White Space You can do the opposite with ‘white-space‘ CSS. For example- if you don’t want to create […]
Read More →The following CSS will create space between lines: You can use any numbers to specify the line-height depending on your font. But normally we use “1.7” and it also depends on the font families. You can also specify the line-height with “px, em, cm, %” etc. For example: Create Space Between Paragraphs You have to use the margin property to create space between paragraphs. See the following example: This code will create the bottom margin of the paragraphs by 60 pixels. If you need to create space both at the top & bottom of the paragraphs, then use the following […]
Read More →When you create a link, the underline is automatically added to the anchor text. This is the default behavior of any web browser. But you can remove the underline from the link using the following CSS: The above CSS will remove the underline globally. That means the underline will disappear from all the links from your website. But if you want to hide the underline from a specific link, you have to target the link by class or ID name. For example, you want to hide the underline from an element that has a CSS class named “unicorn.” Now you […]
Read More →