1. CSS

2. CSs CSS stands for Cascading Style Sheets
CSS describes how HTML elements are to be displayed on screen, paper, or in other media
CSS saves a lot of work. It can control the layout of multiple web pages all at once
External stylesheets are stored in CSS files

3. CSS Syntax and Selectors

4. Selectors
CSS selectors are used to "find" (or select) HTML elements based on their element name, id, class, attribute, and more.
Element Selector
The element selector selects elements based on the element name
ID Selector
The id selector uses the id attribute of an HTML element to select a specific element.
Class selector
The class selector selects elements with a specific class attribute

5. Element Selector

6. ID Selector

7. Class Selector

8. Grouping Selectors

9. Three Ways to Insert CSS
External style sheet
Internal style sheet
Inline style

10. External Style Sheet
We can change the look of an entire website by changing just one file
/*mystyle.css*/
body {     background-color: lightblue; } h1 {     color: navy;     margin-left: 20px; }

11. Internal Style Sheet
An internal style sheet may be used if one single page has a unique style

12. Inline Styles
An inline style may be used to apply a unique style for a single element.

13. Background
Background Color
Background Image

14. Background - Shorthand property
When using the shorthand property the order of the property values is:
background-color
background-image
background-repeat
background-attachment
background-position

15. Background Properties

16. CSS border
 CSS border properties allow you to specify the style, width, and color of an element's border

17. Border Properties Property Description border
Sets all the border properties in one declaration
border-bottom
Sets all the bottom border properties in one declaration
border-bottom-color
Sets the color of the bottom border
border-bottom-style
Sets the style of the bottom border
border-bottom-width
Sets the width of the bottom border
border-color
Sets the color of the four borders
border-left
Sets all the left border properties in one declaration
border-left-color
Sets the color of the left border
border-left-style
Sets the style of the left border
border-left-width
Sets the width of the left border
border-radius
Sets all the four border-*-radius properties for rounded corners
border-right
Sets all the right border properties in one declaration
border-right-color
Sets the color of the right border
border-right-style
Sets the style of the right border
border-right-width
Sets the width of the right border
border-style
Sets the style of the four borders
border-top
Sets all the top border properties in one declaration
border-top-color
Sets the color of the top border
border-top-style
Sets the style of the top border
border-top-width
Sets the width of the top border
border-width
Sets the width of the four borders

18. CSS Margin
The CSS margin properties are used to generate space around elements.
The margin properties set the size of the white space outside the border

19. CSS Padding
The CSS padding properties are used to generate space around content.
The padding clears an area around the content (inside the border) of an element

20. CSS Dimension Properties

21. The CSS Box Model
All HTML elements can be considered as boxes. In CSS, the term "box model" is used when talking about design and layout.

22. CSS Box Model

23. CSS Outline
The CSS outline properties specify the style, color, and width of an outline.
An outline is a line that is drawn around elements (outside the borders) to make the element "stand out".

24. Outline Properties

25. CSS Outline

26. CSS Text Text Color Text Alignment Text Decoration
The color property is used to set the color of the text
Text Alignment
The text-align property is used to set the horizontal alignment of a text. (left,right aligned, centered, justified)
Text Decoration
The text-decoration property is used to set or remove decorations from text. (none; is often used to remove underlines from links)
Text Transformation
The text-transform property is used to specify uppercase and lowercase letters in a text.(uppercase,lowercase, capitalize)

27. CSS Text Text Indentation
The text-indent property is used to specify the indentation of the first line of a text
Letter Spacing
The letter-spacing property is used to specify the space between the characters in a text
Line Height
The line-height property is used to specify the space between lines:
Text Direction
The direction property is used to change the text direction of an element:
Word Spacing
The word-spacing property is used to specify the space between the words in a text

28. CSS Text

29. CSS font
The CSS font properties define the font family, boldness, size, and the style of a text.
In CSS, there are two types of font family names:
generic family - a group of font families with a similar look (like "Serif" or "Monospace")
font family - a specific font family (like "Times New Roman" or "Arial")

30. CSS Font Families

31. Font Family

32. Font Size
The font-size property sets the size of the text

33. Fonts properties

34. CSS Links
Links can be styled with any CSS property (e.g. color, font-family, background, etc.)

35. CSS Links

36. display Property
The display property is the most important CSS property for controlling layout
Every HTML element has a default display value depending on what type of element it is. The default display value for most elements is block or inline

37. Display Block-level Elements Inline Elements
<div>,<h1>, <h6>,<p>,<form>,<header>,<footer>,<section>
Inline Elements
<span>,<a>,<img>

38. CSS Overflow
The CSS overflow property specifies whether to clip content or to add scrollbars when the content of an element is too big to fit in a specified area.(visible ,hidden,scroll,auto)

39. CSS Float
The float property specifies whether or not an element should float.

40. CSS Clear
The clear property is used to control the behavior of floating elements

41. Image Opacity
The opacity property specifies the opacity/transparency of an element

42. Image Opacity

43. CSS Navigation Bar

45. CSS Form

46. CSS Select-Form

47. CSS textbox - form

48. CSS textbox

49. CSS3

50. CSS3