CSS Basics 1

CSS (cascading style Sheets) is used to render the style of HTML element labels.

1. CSS can be added to HTML in the following ways:
Inline style-use the Style property in HTML elements
Internal style sheet-use <style> elements to include CSS in the header External references-Using external CSS files
The best way to do this is by referencing the CSS file externally.

P
{
color:red;
Text-align:center;
}

2. CSS comments start with "/*" and End with "*/"

3. ID Selector
The ID selector can specify a specific style for an HTML element that is labeled with a specific ID.
The HTML element sets the ID selector with the id attribute, and the ID selector in the CSS is defined as "#".
The following style rules apply to element properties Id= "PARA1":
#para1
{
Text-align:center;
color:red;
}

The class selector is used to describe the style of a set of elements, which differs from the ID selector, and class can be used in multiple elements.
The class selector is represented in the HTML as a class attribute, and in CSS, the category selector takes a point "." Number display:
In the following example, all HTML elements that have a center class are centered.
. center {Text-align:center;}
P.center {text-align:center;} specifies P

If some properties are defined by the same selector in a different style sheet, the property values are inherited from the more specific style sheet.

4. What style is used when the same HTML element is defined by more than one style?
Generally, all styles are stacked in a new virtual style sheet according to the following rules, where the number 4 has the highest precedence.
1. Browser default settings
2. External style sheet
3. Internal style sheet (inside 4. Inline style (inside HTML elements)
Therefore, the inline style (inside the HTML element) has the highest precedence, which means that it takes precedence over the style declaration in the label, the style declaration in the external style sheet, or the style declaration in the browser (the default).

The background shorthand property, which is to set the Background property in a declaration.
Background-attachment whether the background image is fixed or scrolls along with the rest of the page.
Background-color sets the background color of the element.
Background-image set the image to the background.
Background-position sets the starting position of the background image.
Background-repeat sets whether and how the background image repeats.

Color Set Text colors
Direction sets the text orientation.
letter-spacing Setting Character Spacing
Line-height Setting Row Height
Text-align aligning text in an element
Text-decoration adding adornments to text
Text-indent indent the first line of text in an element
Text-shadow Setting text Shadows
Text-transform the letters in the control element
Unicode-bidi Sets or returns whether text is overridden
Vertical-align Setting the vertical alignment of elements
White-space how whitespace is handled in the SET element
word-spacing Set Word Spacing

Font sets all of the fonts properties in a declaration
font-family font family for specified text
Font-size the font size of the specified text
Font-style the font style of the specified text
Font-variant displays text in either a small uppercase font or a normal font.
Font-weight Specifies the weight of the font.

a:link {color: #FF0000;}/* not visited link */
a:visited {color: #00FF00;}/* Visited link */
a:hover {color: #FF00FF;}/* Move mouse over link */
a:active {color: #0000FF;}//Mouse click */

H1.hidden {Visibility:hidden;}
H1.hidden {display:none;}

Properties and Value selectors
[Title~=hello] {Color:blue;}

Input[type= "Text"]
{
width:150px;
Display:block;
margin-bottom:10px;
Background-color:yellow;
}
Input[type= "button"]
{
width:120px;
margin-left:35px;
Display:block;
}

CSS Basics 1