KEMBAR78
Introduction to CSS and all properties.pptx
Neelotpal Dey, profile picture
Uploaded byNeelotpal Dey
189 views

Introduction to CSS and all properties.pptx

This document provides a comprehensive introduction to CSS (Cascading Style Sheets), discussing its role in web development, syntax structure, and various CSS properties related to typography, color, background, layout, and transformations. It highlights the importance of CSS in separating content from presentation, enhancing user experience, and enabling responsive design. The document also details the evolution of CSS through its versions and the functionalities of specific properties for effective web design.

Download to read offline
1 / 123
2 / 123
3 / 123
4 / 123
5 / 123
Most read
6 / 123
7 / 123
8 / 123
9 / 123
10 / 123
11 / 123
12 / 123
Most read
13 / 123
Most read
14 / 123
15 / 123
16 / 123
17 / 123
18 / 123
19 / 123
20 / 123
21 / 123
22 / 123
23 / 123
24 / 123
25 / 123
26 / 123
27 / 123
28 / 123
29 / 123
30 / 123
31 / 123
32 / 123
33 / 123
34 / 123
35 / 123
36 / 123
37 / 123
38 / 123
39 / 123
40 / 123
41 / 123
42 / 123
43 / 123
44 / 123
45 / 123
46 / 123
47 / 123
48 / 123
49 / 123
50 / 123
51 / 123
52 / 123
53 / 123
54 / 123
55 / 123
56 / 123
57 / 123
58 / 123
59 / 123
60 / 123
61 / 123
62 / 123
63 / 123
64 / 123
65 / 123
66 / 123
67 / 123
68 / 123
69 / 123
70 / 123
71 / 123
72 / 123
73 / 123
74 / 123
75 / 123
76 / 123
77 / 123
78 / 123
79 / 123
80 / 123
81 / 123
82 / 123
83 / 123
84 / 123
85 / 123
86 / 123
87 / 123
88 / 123
89 / 123
90 / 123
91 / 123
92 / 123
93 / 123
94 / 123
95 / 123
96 / 123
97 / 123
98 / 123
99 / 123
100 / 123
101 / 123
102 / 123
103 / 123
104 / 123
105 / 123
106 / 123
107 / 123
108 / 123
109 / 123
110 / 123
111 / 123
112 / 123
113 / 123
114 / 123
115 / 123
116 / 123
117 / 123
118 / 123
119 / 123
120 / 123
121 / 123
122 / 123
123 / 123
@neelotpal.dey I. Introduction to CSS
@neelotpal.dey A. What is CSS?  - CSS (Cascading Style Sheets) is a stylesheet language used to describe the presentation of a document written in HTML or XML.  - It allows developers to control the visual styling of web pages, including layout, colors, fonts, and other design elements.
@neelotpal.dey B. Importance of CSS in web development  - Separates content (HTML) from presentation (CSS), enabling better maintainability and reusability.  - Provides consistent styling across multiple web pages.  - Enhances the overall user experience by creating visually appealing and accessible designs.  - Enables responsive design, allowing websites to adapt to different devices and screen sizes.
@neelotpal.dey C. Versions of CSS  - CSS 1 (1996): The initial version, providing basic styling capabilities.  - CSS 2 (1998): Introduced advanced selectors, positioning, and media types.  - CSS 2.1 (2004): A revision of CSS 2, fixing errors and adding a few new features.  - CSS 3 (ongoing): Modularized and continuously evolving, introducing new features and improvements.
@neelotpal.dey II. CSS Syntax
@neelotpal.dey A. Syntax structure (selector, property, value)  - CSS rules consist of a selector, property, and value:  ```css  selector {  property: value;  }  ```  - Selectors define the HTML elements to be styled.  - Properties specify the styles to be applied.  - Values define the specific styling details.
@neelotpal.dey B. CSS comments  - Comments in CSS are used to provide explanations or temporarily disable code.  - Single-line comments start with `/*` and end with `*/`.  ```css  /* This is a CSS comment */  ```
@neelotpal.dey I. Introduction to CSS Properties  A. What are CSS properties?  - CSS properties define the style and presentation of HTML elements  B. Importance of CSS properties in web design  - CSS properties enable separation of content and presentation  - They provide control over various aspects of web page design
@neelotpal.dey II. Typography Properties
@neelotpal.dey A. Font Properties
@neelotpal.dey 1. font-family  - Description: Specifies the font family for text  - Syntax: font-family: "font-family-name", generic-family;
@neelotpal.dey 2. font-size  - Description: Sets the size of the text  - Syntax: font-size: size-value;
@neelotpal.dey 3. font-weight  - Description: Specifies the weight (boldness) of the font  - Syntax: font-weight: normal|bold|bolder|lighter|100|200|...|900;
@neelotpal.dey 4. font-style  - Description: Specifies the font style (normal, italic, or oblique)  - Syntax: font-style: normal|italic|oblique;
@neelotpal.dey 5. font-variant  - Description: Specifies the variant of the font (small-caps or normal)  - Syntax: font-variant: normal|small-caps;
@neelotpal.dey B. Text Properties
@neelotpal.dey 1. text-align  - Description: Specifies the horizontal alignment of text  - Syntax: text-align: left|right|center|justify|start|end;
@neelotpal.dey 2. text-decoration  - Description: Adds decoration to text (underline, overline, line-through)  - Syntax: text-decoration: none|underline|overline|line-through;
@neelotpal.dey 3. text-transform  - Description: Controls the capitalization of text  - Syntax: text-transform: none|capitalize|uppercase|lowercase;
@neelotpal.dey 4. text-indent  - Description: Specifies the indentation of the first line of text  - Syntax: text-indent: length-value;
@neelotpal.dey 5. line-height  - Description: Sets the height of a line of text  - Syntax: line-height: normal|number|length|percentage;
@neelotpal.dey 6. letter-spacing  - Description: Increases or decreases the space between characters  - Syntax: letter-spacing: normal|length-value;
@neelotpal.dey 7. word-spacing  - Description: Increases or decreases the space between words  - Syntax: word-spacing: normal|length-value;
@neelotpal.dey 8. white-space  - Description: Specifies how white-space inside an element is handled  - Syntax: white-space: normal|nowrap|pre|pre-line|pre-wrap;
@neelotpal.dey 9. text-shadow  - Description: Adds a shadow effect to text  - Syntax: text-shadow: h-shadow v-shadow blur-radius color;
@neelotpal.dey III. Color and Background Properties
@neelotpal.dey A. Color Properties  1. color  - Description: Sets the foreground color of text  - Syntax: color: color-name|hex-value|rgb-value|rgba-value;  2. opacity  - Description: Specifies the opacity/transparency level of an element  - Syntax: opacity: value;  /* value from 0.0 (fully transparent) to 1.0 (fully opaque) */
@neelotpal.dey B. Background Properties
@neelotpal.dey 1. background-color  - Description: Sets the background color of an element  - Syntax: background-color: color-name|hex-value|rgb- value|rgba-value;
@neelotpal.dey 2. background-image  - Description: Specifies one or more background images for an element  - Syntax: background-image: url("image-path")|linear- gradient()|radial-gradient()|...;
@neelotpal.dey 3. background-repeat  - Description: Specifies how background images are repeated  - Syntax: background-repeat: repeat|repeat-x|repeat-y|no- repeat;
@neelotpal.dey 4. background-position  - Description: Specifies the starting position of a background image  - Syntax: background-position: x-value y-value|position- keyword;
@neelotpal.dey 5. background-size  - Description: Specifies the size of the background image(s)  - Syntax: background-size: auto|length- value|percentage|cover|contain;
@neelotpal.dey 6. background-attachment  - Description: Specifies whether the background image scrolls with the content or is fixed  - Syntax: background-attachment: scroll|fixed|local;
@neelotpal.dey 7. background-clip  - Description: Specifies the painting area of the background  - Syntax: background-clip: border-box|padding-box|content- box;
@neelotpal.dey 8. background-origin  - Description: Specifies the positioning area of the background image(s)  - Syntax: background-origin: padding-box|border-box|content- box;
@neelotpal.dey 9. background (shorthand)  - Description: A shorthand property for setting multiple background properties at once  - Syntax: background: bg-color bg-image position/bg-size bg- repeat bg-origin bg-clip bg-attachment;
@neelotpal.dey IV. Box Model Properties
@neelotpal.dey A. Margin Properties
@neelotpal.dey 1. margin  - Description: A shorthand property for setting all four margins at once  - Syntax: margin: value; /* top, right, bottom, left */
@neelotpal.dey 2. margin-top  - Description: Sets the top margin of an element  - Syntax: margin-top: length-value;
@neelotpal.dey 3. margin-right  - Description: Sets the right margin of an element  - Syntax: margin-right: length-value;
@neelotpal.dey 4. margin-bottom  - Description: Sets the bottom margin of an element  - Syntax: margin-bottom: length-value;
@neelotpal.dey 5. margin-left  - Description: Sets the left margin of an element  - Syntax: margin-left: length-value;
@neelotpal.dey B. Padding Properties
@neelotpal.dey 1. padding  - Description: A shorthand property for setting all four paddings at once  - Syntax: padding: value; /* top, right, bottom, left */
@neelotpal.dey 2. padding-top  - Description: Sets the top padding of an element  - Syntax: padding-top: length-value;
@neelotpal.dey 3. padding-right  - Description: Sets the right padding of an element  - Syntax: padding-right: length-value;
@neelotpal.dey 4. padding-bottom  - Description: Sets the bottom padding of an element  - Syntax: padding-bottom: length-value;
@neelotpal.dey 5. padding-left  - Description: Sets the left padding of an element  - Syntax: padding-left: length-value;
@neelotpal.dey C. Border Properties
@neelotpal.dey 1. border  - Description: A shorthand property for setting all border properties at once  - Syntax: border: border-width border-style border-color;
@neelotpal.dey 2. border-width  - Description: Sets the width of the border  - Syntax: border-width: thin|medium|thick|length-value;
@neelotpal.dey 3. border-style  - Description: Sets the style of the border  - Syntax: border-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset;
@neelotpal.dey 4. border-color  - Description: Sets the color of the border  - Syntax: border-color: color-name|hex-value|rgb-value|rgba- value;
@neelotpal.dey 5. border-radius  - Description: Specifies the radius of rounded corners  - Syntax: border-radius: length-value;
@neelotpal.dey D. Box-sizing  - Description: Specifies how the total width and height of an element are calculated  - Syntax: box-sizing: content-box|border-box;
@neelotpal.dey V. Layout Properties
@neelotpal.dey A. Display Properties
@neelotpal.dey 1. display  - Description: Specifies the display behavior of an element  - Syntax: display: inline|block|inline-block|flex|inline- flex|grid|inline-grid|none;
@neelotpal.dey 2. visibility  - Description: Specifies whether an element is visible or hidden  - Syntax: visibility: visible|hidden|collapse;
@neelotpal.dey 3. overflow  - Description: Specifies how to handle content that overflows its container  - Syntax: overflow: visible|hidden|scroll|auto;
@neelotpal.dey B. Positioning Properties
@neelotpal.dey 1. position  - Description: Specifies the positioning method for an element  - Syntax: position: static|relative|absolute|fixed|sticky;
@neelotpal.dey 2. top, right, bottom, left  - Description: Used with position properties to specify the position offset  - Syntax: top/right/bottom/left: auto|length-value|percentage;
@neelotpal.dey 3. z-index  - Description: Specifies the stack order of positioned elements  - Syntax: z-index: auto|integer;
@neelotpal.dey 4. float  - Description: Specifies how an element should float  - Syntax: float: none|left|right;
@neelotpal.dey 5. clear  - Description: Specifies which sides of an element should allow floating elements  - Syntax: clear: none|left|right|both;
@neelotpal.dey C. Flexbox Properties
@neelotpal.dey 1. display: flex  - Description: Defines a flex container  - Syntax: display: flex|inline-flex;
@neelotpal.dey 2. flex-direction  - Description: Specifies the direction of flex items  - Syntax: flex-direction: row|row-reverse|column|column- reverse;
@neelotpal.dey 3. flex-wrap  - Description: Specifies whether flex items should wrap or not  - Syntax: flex-wrap: nowrap|wrap|wrap-reverse;
@neelotpal.dey 4. justify-content  - Description: Aligns flex items along the main axis  - Syntax: justify-content: flex-start|flex-end|center|space- between|space-around|space-evenly;
@neelotpal.dey 5. align-items  - Description: Aligns flex items along the cross axis  - Syntax: align-items: stretch|flex-start|flex-end|center|baseline;
@neelotpal.dey 6. align-content  - Description: Aligns flex lines within a flex container  - Syntax: align-content: flex-start|flex-end|center|space- between|space-around|stretch;
@neelotpal.dey 7. flex-grow  - Description: Specifies how much a flex item will grow relative to the rest  - Syntax: flex-grow: number;
@neelotpal.dey 8. flex-shrink  - Description: Specifies how much a flex item will shrink relative to the rest  - Syntax: flex-shrink: number;
@neelotpal.dey 9. flex-basis  - Description: Specifies the initial length of a flex item  - Syntax: flex-basis: auto|length-value;
@neelotpal.dey 10. order  - Description: Specifies the order of flex items  - Syntax: order: integer;
@neelotpal.dey D. Grid Properties
@neelotpal.dey 1. display: grid  - Description: Defines a grid container  - Syntax: display: grid|inline-grid;
@neelotpal.dey 2. grid-template-columns  - Description: Specifies the sizes of the columns in a grid layout  - Syntax: grid-template-columns: value...; /* <track-size>... | <line-name>... */
@neelotpal.dey 3. grid-template-rows  - Description: Specifies the sizes of the rows in a grid layout  - Syntax: grid-template-rows: value...; /* <track-size>... | <line- name>... */
@neelotpal.dey 4. grid-gap  - Description: Specifies the gaps between rows and columns  - Syntax: grid-gap: <row-gap> <column-gap>;
@neelotpal.dey 5. grid-column  - Description: Specifies which grid column(s) an item should span  - Syntax: grid-column: <start-line> / <end-line>;
@neelotpal.dey 6. grid-row  - Description: Specifies which grid row(s) an item should span  - Syntax: grid-row: <start-line> / <end-line>;
@neelotpal.dey 7. grid-area  - Description: Specifies a grid item's position and size within the grid  - Syntax: grid-area: <row-start> / <column-start> / <row-end> / <column-end>;
@neelotpal.dey 8. justify-items  - Description: Aligns grid items along the inline (row) axis  - Syntax: justify-items: start|end|center|stretch;
@neelotpal.dey 9. align-items  - Description: Aligns grid items along the block (column) axis  - Syntax: align-items: start|end|center|stretch;
@neelotpal.dey VI. Transformation and Transition Properties
@neelotpal.dey A. Transform Properties
@neelotpal.dey 1. transform  - Description: Applies a 2D or 3D transformation to an element  - Syntax: transform: none|transform-functions;
@neelotpal.dey 2. transform-origin  - Description: Specifies the origin of transformation for an element  - Syntax: transform-origin: x-value y-value z-value;
@neelotpal.dey 3. transform-style  - Description: Specifies how nested elements are rendered in 3D space  - Syntax: transform-style: flat|preserve-3d;
@neelotpal.dey B. Transition Properties
@neelotpal.dey 1. transition  - Description: A shorthand property for setting all transition properties  - Syntax: transition: property duration timing-function delay;
@neelotpal.dey 2. transition-property  - Description: Specifies the name(s) of CSS properties to transition  - Syntax: transition-property: none|property-name|all;
@neelotpal.dey 3. transition-duration  - Description: Specifies the duration of the transition effect  - Syntax: transition-duration: time;
@neelotpal.dey 4. transition-timing-function  - Description: Specifies the timing function for the transition effect  - Syntax: transition-timing-function: ease|linear|ease-in|ease- out|ease-in-out|cubic-bezier()|steps();
@neelotpal.dey 5. transition-delay  - Description: Specifies the delay before the transition effect starts  - Syntax: transition-delay: time;
@neelotpal.dey VII. Animation Properties
@neelotpal.dey A. @keyframes  - Description: Defines the animation sequence  - Syntax: @keyframes animation-name { /* keyframe rules */ }
@neelotpal.dey B. animation-name  - Description: Specifies the name of the @keyframes animation  - Syntax: animation-name: animation-name;
@neelotpal.dey C. animation-duration  - Description: Specifies the duration of the animation  - Syntax: animation-duration: time;
@neelotpal.dey D. animation-timing-function  - Description: Specifies the timing function for the animation  - Syntax: animation-timing-function: ease|linear|ease-in|ease- out|ease-in-out|cubic-bezier()|steps();
@neelotpal.dey E. animation-delay  - Description: Specifies the delay before the animation starts  - Syntax: animation-delay: time;
@neelotpal.dey F. animation-iteration-count  - Description: Specifies the number of times the animation should repeat  - Syntax: animation-iteration-count: infinite|number;
@neelotpal.dey G. animation-direction  - Description: Specifies whether the animation should play forwards, backwards, or alternate  - Syntax: animation-direction: normal|reverse|alternate|alternate- reverse;
@neelotpal.dey H. animation-fill-mode  - Description: Specifies how to apply styles before and after the animation  - Syntax: animation-fill-mode: none|forwards|backwards|both;
@neelotpal.dey I. animation-play-state  - Description: Specifies whether the animation is running or paused  - Syntax: animation-play-state: paused|running;
@neelotpal.dey VIII. List and Table Properties
@neelotpal.dey A. List Properties
@neelotpal.dey 1. list-style-type  - Description: Specifies the type of list-item marker  - Syntax: list-style-type: disc|circle|square|decimal|lower- roman|upper-roman|...;
@neelotpal.dey 2. list-style-image  - Description: Specifies an image as the list-item marker  - Syntax: list-style-image: none|url("image-path");
@neelotpal.dey 3. list-style-position  - Description: Specifies where the list-item marker should be positioned  - Syntax: list-style-position: inside|outside;
@neelotpal.dey B. Table Properties
@neelotpal.dey 1. border-collapse  - Description: Specifies whether table borders should be collapsed into a single border  - Syntax: border-collapse: separate|collapse;
@neelotpal.dey 2. border-spacing  - Description: Specifies the distance between the borders of adjacent cells  - Syntax: border-spacing: horizontal-value vertical-value;
@neelotpal.dey 3. caption-side  - Description: Specifies where the table caption should be placed  - Syntax: caption-side: top|bottom;
@neelotpal.dey 4. empty-cells  - Description: Specifies how to display borders and backgrounds of empty cells  - Syntax: empty-cells: show|hide;
@neelotpal.dey 5. table-layout  - Description: Specifies the layout algorithm for rendering tables  - Syntax: table-layout: auto|fixed;
@neelotpal.dey IX. User Interface Properties
@neelotpal.dey A. Cursor  - Description: Spec

More Related Content

PDF
CSS3 Media Queries
byRuss Weakley
 
PDF
HTML Head Section Elements
bySomesh Gulati
 
PPTX
Css
byshanmuga rajan
 
PPT
CSS ppt
bySanmuga Nathan
 
PPTX
Cascading style sheet
byMichael Jhon
 
PPT
Box Model
byAmit Kumar Singh
 
PDF
CSS3, Media Queries, and Responsive Design
byZoe Gillenwater
 
PPT
Css Ppt
byHema Prasanth
 
CSS3 Media Queries
byRuss Weakley
 
HTML Head Section Elements
bySomesh Gulati
 
Css
byshanmuga rajan
 
CSS ppt
bySanmuga Nathan
 
Cascading style sheet
byMichael Jhon
 
Box Model
byAmit Kumar Singh
 
CSS3, Media Queries, and Responsive Design
byZoe Gillenwater
 
Css Ppt
byHema Prasanth
 

What's hot

PPTX
Css selectors
byParth Trivedi
 
PPTX
Cascading style sheets (CSS)
byHarshita Yadav
 
PDF
Introduction to HTML5
byGil Fink
 
PPTX
Document Object Model
byMayur Mudgal
 
PDF
CSS Dasar #3 : Penempatan CSS
bySandhika Galih
 
PPTX
Css
byAbhishek Kesharwani
 
PDF
JavaScript - Chapter 10 - Strings and Arrays
byWebStackAcademy
 
PPT
Introduction to Cascading Style Sheets (CSS)
byChris Poteet
 
PPTX
(Fast) Introduction to HTML & CSS
byDave Kelly
 
PDF
Html text and formatting
byeShikshak
 
PPTX
Modules in Python Programming
bysambitmandal
 
PPTX
CSS - Text Properties
byhstryk
 
PPSX
CSS Box Model Presentation
byReed Crouch
 
PDF
HTML CSS JS in Nut shell
byAshwin Shiv
 
PPTX
Css ppt
byNidhi mishra
 
PPTX
Css font properties
byJesus Obenita Jr.
 
PDF
Introducing CSS Grid Layout
byRachel Andrew
 
ODP
CSS Basics
bySanjeev Kumar
 
PDF
Introduction to CSS3
byDoris Chen
 
PPTX
Introduction to HTML5 Canvas
byMindy McAdams
 
Css selectors
byParth Trivedi
 
Cascading style sheets (CSS)
byHarshita Yadav
 
Introduction to HTML5
byGil Fink
 
Document Object Model
byMayur Mudgal
 
CSS Dasar #3 : Penempatan CSS
bySandhika Galih
 
Css
byAbhishek Kesharwani
 
JavaScript - Chapter 10 - Strings and Arrays
byWebStackAcademy
 
Introduction to Cascading Style Sheets (CSS)
byChris Poteet
 
(Fast) Introduction to HTML & CSS
byDave Kelly
 
Html text and formatting
byeShikshak
 
Modules in Python Programming
bysambitmandal
 
CSS - Text Properties
byhstryk
 
CSS Box Model Presentation
byReed Crouch
 
HTML CSS JS in Nut shell
byAshwin Shiv
 
Css ppt
byNidhi mishra
 
Css font properties
byJesus Obenita Jr.
 
Introducing CSS Grid Layout
byRachel Andrew
 
CSS Basics
bySanjeev Kumar
 
Introduction to CSS3
byDoris Chen
 
Introduction to HTML5 Canvas
byMindy McAdams
 

Similar to Introduction to CSS and all properties.pptx

PPTX
CSS Topic wise Short notes ppt by Navya.E
byNavyaEnugala
 
PPTX
web Technolotogies notes lke CSS443.pptx
byssuser46d915
 
PPTX
CSS Cascade Style Sheet
byAdeel Rasheed
 
PPTX
Css
byVijay Raj Yanamala
 
PDF
Css2
byAbhishek Kesharwani
 
PPTX
Css2
byAbhishek Kesharwani
 
PDF
HTML ,CSS ,JQuery Cheat Sheet
byShiva Saxena
 
PPTX
CSS
byMallikarjuna G D
 
DOC
Art of css
byRaphael Wanjiku
 
PPTX
css front end development , designing web page
byIndu32
 
PPTX
CSS presentation for beginners where they can understand easily
byIndu32
 
PPTX
Css3
byAnjan Banda
 
PPTX
Cordova training - Day 2 Introduction to CSS 3
byBinu Paul
 
PPTX
Web - CSS 1.pptx
byharoon451422
 
PPT
gdg_workshop 4 on web development HTML & CSS
bySaniyaKhan484230
 
PPTX
uptu web technology unit 2 Css
byAbhishek Kesharwani
 
PPTX
Cascading style sheets (CSS-Web Technology)
byTimbal Mayank
 
PPTX
CSS 3 Overview
byDanilo Sousa
 
PDF
CascadingStyleSheets in ONESHOT By DeathCodeYT .pdf
bybalbirnainnain496
 
PPTX
Unit - 3 CSS(Cascading Style Sheet).pptx
bykushwahanitesh592
 
CSS Topic wise Short notes ppt by Navya.E
byNavyaEnugala
 
web Technolotogies notes lke CSS443.pptx
byssuser46d915
 
CSS Cascade Style Sheet
byAdeel Rasheed
 
Css
byVijay Raj Yanamala
 
Css2
byAbhishek Kesharwani
 
Css2
byAbhishek Kesharwani
 
HTML ,CSS ,JQuery Cheat Sheet
byShiva Saxena
 
CSS
byMallikarjuna G D
 
Art of css
byRaphael Wanjiku
 
css front end development , designing web page
byIndu32
 
CSS presentation for beginners where they can understand easily
byIndu32
 
Css3
byAnjan Banda
 
Cordova training - Day 2 Introduction to CSS 3
byBinu Paul
 
Web - CSS 1.pptx
byharoon451422
 
gdg_workshop 4 on web development HTML & CSS
bySaniyaKhan484230
 
uptu web technology unit 2 Css
byAbhishek Kesharwani
 
Cascading style sheets (CSS-Web Technology)
byTimbal Mayank
 
CSS 3 Overview
byDanilo Sousa
 
CascadingStyleSheets in ONESHOT By DeathCodeYT .pdf
bybalbirnainnain496
 
Unit - 3 CSS(Cascading Style Sheet).pptx
bykushwahanitesh592
 

Recently uploaded

PPTX
Agriculture Lesson Note for Grade 11 Chapter 3 & 4.pptx
byNajibMuhidin
 
PDF
Learning English by Project Based Learning: How to Make Foreign Friends
bysilvianalevana
 
PPTX
English Home Language & First Additional Language P2 Preparation.pptx
byMasingita Maswanganye
 
PPTX
Essay Type Answer Writing Analysis Workshop.pptx
byDhatriParmar
 
PPTX
Capital Budgeting - Risk Analysis Using Sensitivity Analysis
bySundar B N
 
DOCX
PRESS STATEMENT - Response to Minority_ Press Ready.docx
bynservice241
 
PDF
Admin Slides for Oct'25 semester (Progression)
byGreat Files
 
PDF
Total Quality Management : A presentation by a third year student.
byMbalenhle Ndlovu
 
PPTX
psychoanalytic Theory.pptx, MSc. Nursing
byKomalJaiswal46
 
DOCX
Extension Education: From theory to practice by Dr Subin K Mohan.docx
byDrSubinKMohan
 
PPTX
Basics for Conducting Bibliometric Analysis - Dr Ahsan Riaz
bySystematic Reviews Network (SRN)
 
PDF
BUSINESS ETHICS – UNIT I: Introduction to Business Ethics
byD NANEE
 
PPTX
How can education build trust in a polarised world_Jonathan James_OECD .pptx
byEduSkills OECD
 
PPTX
PECTORAL REGION.pptx Human anatomy,Bmls,
byKISMAT ALI
 
PDF
Slit lamp parts 2/ppt/notes/download.pdf
byAnmol Singh
 
PDF
BUSINESS ETHICS – UNIT V: Ethical Insights from Thirukkural and Modern Thought
byD NANEE
 
PPTX
DO 34 s 2025 - ammendment of DO 24 s 2025.pptx
byJeanalynEstrellado3
 
PDF
History of Department of AIHC and Archaeology_BHU
byBanaras Hindu University
 
PPTX
DBP - BITA Introduction Slides Oct 202526
byGreat Files
 
PPTX
GAS chromatography ppt (Presentation) by Jatin Chauhan
byjatinchauhan1618
 
Agriculture Lesson Note for Grade 11 Chapter 3 & 4.pptx
byNajibMuhidin
 
Learning English by Project Based Learning: How to Make Foreign Friends
bysilvianalevana
 
English Home Language & First Additional Language P2 Preparation.pptx
byMasingita Maswanganye
 
Essay Type Answer Writing Analysis Workshop.pptx
byDhatriParmar
 
Capital Budgeting - Risk Analysis Using Sensitivity Analysis
bySundar B N
 
PRESS STATEMENT - Response to Minority_ Press Ready.docx
bynservice241
 
Admin Slides for Oct'25 semester (Progression)
byGreat Files
 
Total Quality Management : A presentation by a third year student.
byMbalenhle Ndlovu
 
psychoanalytic Theory.pptx, MSc. Nursing
byKomalJaiswal46
 
Extension Education: From theory to practice by Dr Subin K Mohan.docx
byDrSubinKMohan
 
Basics for Conducting Bibliometric Analysis - Dr Ahsan Riaz
bySystematic Reviews Network (SRN)
 
BUSINESS ETHICS – UNIT I: Introduction to Business Ethics
byD NANEE
 
How can education build trust in a polarised world_Jonathan James_OECD .pptx
byEduSkills OECD
 
PECTORAL REGION.pptx Human anatomy,Bmls,
byKISMAT ALI
 
Slit lamp parts 2/ppt/notes/download.pdf
byAnmol Singh
 
BUSINESS ETHICS – UNIT V: Ethical Insights from Thirukkural and Modern Thought
byD NANEE
 
DO 34 s 2025 - ammendment of DO 24 s 2025.pptx
byJeanalynEstrellado3
 
History of Department of AIHC and Archaeology_BHU
byBanaras Hindu University
 
DBP - BITA Introduction Slides Oct 202526
byGreat Files
 
GAS chromatography ppt (Presentation) by Jatin Chauhan
byjatinchauhan1618
 
In this document
Powered by AI

Introduction to CSS and its importance, versions including CSS 1, 2, 2.1, and 3.

Basic CSS structure includes selectors, properties, values, and usage of comments.

Definition and significance of CSS properties in separating content and presentation.

CSS font and text properties including font-family, size, weight, style, alignment, and decoration.

CSS color properties and background management including color, opacity, background-color, and images.

Properties related to margins, padding, borders, and box-sizing in CSS.

CSS layout properties including display types, positioning, and flexbox/grid properties.

CSS transformation effects, transition settings including duration and timing.

CSS animation keyframes and properties controlling animation sequences and effects.

CSS properties for lists and tables, detailing styles and layout options.

Introduction to user interface properties such as cursor styles.

Introduction to CSS and all properties.pptx