What IS CSS?
Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in HTML or XML (including XML dialects such as SVG, MathML, or XHTML). CSS describes how elements should be rendered on screen, on paper, in speech, or on other media.
CSS is used along with HTML and JavaScript in most websites to create user interfaces for web applications and user interfaces for many mobile applications. A CSS rule set contains a selector and a declaration block.
The selector points to the HTML element you want to style.
The declaration block contains one or more declarations separated by semicolons. Each declaration includes a CSS property name and a value, separated by a colon.
What Are CSS Comments?
CSS comments are generally written to explain your code. It is very helpful for the users who read your code so that they can easily understand the code. Comments can be placed wherever white space is allowed within the style sheet. They can be used on a single line or span multiple lines.
Begin your comment by adding /* and close your comment by adding */.
SYNTAX: /* Hello */
CSS Id And Class:
An ID selector is a unique identifier of the HTML element to which a particular style must be applied. It is used only when a single HTML element on the web page must have a specific style. Both in Internal and External Style Sheets we use hash (#) for an id selector.
A class selector is used when the same style must be applied to multiple HTML elements on the same web page. Both in Internal and External Style Sheets we use a dot (.) for a class selector.
CSS FONT:
The CSS font properties are used for defining the size, font family, boldness, and style of the text. Besides, it sets the font of the element to a system font. The CSS font property is considered to be a shorthand property. So, here we will explain the following properties:
- Font Family
- Font Style
- Font Size
- Font Weight
- Font Variant
Font Family:
For the font family of the text, we use the font-family property. This is the name of the font.
- generic family – a group of font families having a similar look (like “Serif” or “Sans-serif”)
- font-family – a particular font family (like “Times New Roman” or “Arial”)
When we use a specific font family which consists of more than one word, we take the name in quotes (like “Times New Roman”). At the same time, we must write more than one font family, because in case the browser won’t support your first font family, you can have several other similar font families.
Font Style:
We use font-style property mostly for texts that we want to write in italic. Most of all we use the following values of the font-style property:
- normal, which shows the text normally,
- italic, which shows the text in italics,
- oblique, which “leans” the text.
Font Size:
For the size of our text, we use the font-size property. We need to give value to our property. The values are given by pixels, pt, em, rem, etc. You can find the full list in the font-size section. You need to know that 1em=16px. Most of all we use pixels (px).
Font Variant:
The font-variant property allows setting the text as normal or small-caps from a font family. The small-caps value makes the lowercase letters the uppercase letters, but these converted letters will be displayed a little smaller than normal uppercase letters.
Font Weight:
Mostly we use the following values of the font-weight property:
- normal
- bold
The value can be given also by numbers.
CSS BORDER:
The border property is a shorthand syntax in CSS that accepts multiple values for drawing a line around the element it is applied to.
Syntax: border: <line-width> || <line-style> || <color>
the CSS border property, which includes:
- border-width
- border-color
- border-styles
- border-radius
- border-image
CSS MARGINS:
The margin property defines the outermost portion of the box model, creating space around an element, outside of any defined borders. Margins are set using lengths, percentages, or the keyword auto and can have negative values.
CSS has properties for specifying the margin for each side of an element:
- margin-right
- margin-top
- margin-bottom
- margin-left
CSS Cursor:
The cursor CSS property sets the mouse cursor, if any, to show when the mouse pointer is over an element.
The cursor setting should inform users of the mouse operations that can be performed at the current location, including text selection, activating help or context menus, copying content, resizing tables, and so on. You can specify either the type of cursor using a keyword, or load a specific icon to use (with optional fallback images and mandatory keyword as a final fallback).
CSS BUTTONS:
CSS buttons refer to styled HTML buttons that developers customize to match their website designs. You can manipulate the colors, text sizes, and padding, and even change styling properties when buttons enter different states.
HTML creates buttons but CSS styles them.CSS buttons can differ in size, color, style, etc. CSS buttons often are input fields for users to submit information.
You Might Also Interested In Reading, HTML: How To Insert CSS In HTML?
