SlideShare a Scribd company logo

html-css

html-table

1 of 33
Download to read offline
CSS
Cascading Style Sheet
WHAT IS CSS?
CSS stands for “Cascading Style Sheets”
Cascading refers to the procedure that determines which style will apply
to a certain section, if you have more than one style rule.
Style how you want a certain part of your page to look. You can set
things like color, margins, font, etc for things like tables, paragraphs,
and headings.
Sheets the “sheets” are like templates, or a set of rules, for determining how
the webpage will look.
CSS is a stylesheet language used to describe the presentation of a document
written in HTML or XML.
Why Use CSS?
• CSS is used to define styles for your web
pages, including the design, layout and
variations in display for different devices
and screen sizes.
• A web application will contains hundreds of web pages, which are created
using HTML.
• Formatting these HTML pages will be a laborious process, as
formatting elements need to be applied to each and every page.
• CSS saves lots of work as we can change the appearance and layout of all
the web pages by editing just one single CSS file.
Advantages
CSS Syntax
• A CSS rule-set consists of 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.
• Multiple CSS declarations are separated with semicolons, and
declaration blocks are surrounded by curly braces.
Ad

Recommended

(Fast) Introduction to HTML & CSS
(Fast) Introduction to HTML & CSS (Fast) Introduction to HTML & CSS
(Fast) Introduction to HTML & CSS Dave Kelly
 
Intro to HTML and CSS basics
Intro to HTML and CSS basicsIntro to HTML and CSS basics
Intro to HTML and CSS basicsEliran Eliassy
 
1 03 - CSS Introduction
1 03 - CSS Introduction1 03 - CSS Introduction
1 03 - CSS Introductionapnwebdev
 
Cascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) helpCascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) helpcasestudyhelp
 

More Related Content

What's hot (20)

Introduction to CSS
Introduction to CSSIntroduction to CSS
Introduction to CSS
 
CSS
CSSCSS
CSS
 
CSS
CSSCSS
CSS
 
HTML CSS Basics
HTML CSS BasicsHTML CSS Basics
HTML CSS Basics
 
Html5 and-css3-overview
Html5 and-css3-overviewHtml5 and-css3-overview
Html5 and-css3-overview
 
Html / CSS Presentation
Html / CSS PresentationHtml / CSS Presentation
Html / CSS Presentation
 
CSS3, Media Queries, and Responsive Design
CSS3, Media Queries, and Responsive DesignCSS3, Media Queries, and Responsive Design
CSS3, Media Queries, and Responsive Design
 
Introduction to Cascading Style Sheets (CSS)
Introduction to Cascading Style Sheets (CSS)Introduction to Cascading Style Sheets (CSS)
Introduction to Cascading Style Sheets (CSS)
 
Css Text Formatting
Css Text FormattingCss Text Formatting
Css Text Formatting
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Introduction to CSS
Introduction to CSSIntroduction to CSS
Introduction to CSS
 
HTML and CSS crash course!
HTML and CSS crash course!HTML and CSS crash course!
HTML and CSS crash course!
 
Basic html
Basic htmlBasic html
Basic html
 
Html ppt
Html pptHtml ppt
Html ppt
 
Html forms
Html formsHtml forms
Html forms
 
Basic-CSS-tutorial
Basic-CSS-tutorialBasic-CSS-tutorial
Basic-CSS-tutorial
 
CSS
CSSCSS
CSS
 
Css Basics
Css BasicsCss Basics
Css Basics
 
CSS
CSSCSS
CSS
 
Html n CSS
Html n CSSHtml n CSS
Html n CSS
 

Similar to html-css (20)

CSS
CSSCSS
CSS
 
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.pptwaxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
 
css1.ppt
css1.pptcss1.ppt
css1.ppt
 
CSS
CSSCSS
CSS
 
Lecture-6.pptx
Lecture-6.pptxLecture-6.pptx
Lecture-6.pptx
 
WT CSS
WT  CSSWT  CSS
WT CSS
 
Cascstylesheets
CascstylesheetsCascstylesheets
Cascstylesheets
 
CSS Presentation Notes.pptx
CSS Presentation Notes.pptxCSS Presentation Notes.pptx
CSS Presentation Notes.pptx
 
Css introduction
Css  introductionCss  introduction
Css introduction
 
CSS Basics part One
CSS Basics part OneCSS Basics part One
CSS Basics part One
 
CSS tutorial chapter 1
CSS tutorial chapter 1CSS tutorial chapter 1
CSS tutorial chapter 1
 
CSS notes
CSS notesCSS notes
CSS notes
 
Unit 3 (it workshop).pptx
Unit 3 (it workshop).pptxUnit 3 (it workshop).pptx
Unit 3 (it workshop).pptx
 
Introduction to css by programmerblog.net
Introduction to css by programmerblog.netIntroduction to css by programmerblog.net
Introduction to css by programmerblog.net
 
Cascading Style Sheet
Cascading Style SheetCascading Style Sheet
Cascading Style Sheet
 
css-ppt.pdf
css-ppt.pdfcss-ppt.pdf
css-ppt.pdf
 
Cordova training - Day 2 Introduction to CSS 3
Cordova training - Day 2 Introduction to CSS 3Cordova training - Day 2 Introduction to CSS 3
Cordova training - Day 2 Introduction to CSS 3
 
Introduction to css & its attributes with syntax
Introduction to css & its attributes with syntaxIntroduction to css & its attributes with syntax
Introduction to css & its attributes with syntax
 
Cascading style sheet
Cascading style sheetCascading style sheet
Cascading style sheet
 
CSS_Day_ONE (W3schools)
CSS_Day_ONE (W3schools)CSS_Day_ONE (W3schools)
CSS_Day_ONE (W3schools)
 

More from Dhirendra Chauhan (20)

V35 keys-c
V35  keys-cV35  keys-c
V35 keys-c
 
V34 numeric function-c
V34  numeric function-cV34  numeric function-c
V34 numeric function-c
 
V33 date function-c
V33  date function-cV33  date function-c
V33 date function-c
 
V31 having
V31  havingV31  having
V31 having
 
V30 full join(union intersect etc)
V30  full join(union intersect etc)V30  full join(union intersect etc)
V30 full join(union intersect etc)
 
V29 group by-c
V29  group by-cV29  group by-c
V29 group by-c
 
V28 view
V28  viewV28  view
V28 view
 
V27 constraint
V27 constraintV27 constraint
V27 constraint
 
V26 key
V26 keyV26 key
V26 key
 
V25 sql index
V25 sql indexV25 sql index
V25 sql index
 
V24 cartesion product-c
V24 cartesion product-cV24 cartesion product-c
V24 cartesion product-c
 
V23 function-2
V23 function-2V23 function-2
V23 function-2
 
V22 function-1
V22 function-1V22 function-1
V22 function-1
 
V21 in operator
V21 in operatorV21 in operator
V21 in operator
 
V20 bet ween operator-c
V20 bet ween operator-cV20 bet ween operator-c
V20 bet ween operator-c
 
V19 join method-c
V19 join method-cV19 join method-c
V19 join method-c
 
V18 alias-c
V18 alias-cV18 alias-c
V18 alias-c
 
V17 show command-c
V17 show command-cV17 show command-c
V17 show command-c
 
V16 sql comments-c
V16 sql comments-cV16 sql comments-c
V16 sql comments-c
 
V15 like operator-c
V15 like operator-cV15 like operator-c
V15 like operator-c
 

Recently uploaded

AI Product Management by Abhijit Bendigiri
AI Product Management by Abhijit BendigiriAI Product Management by Abhijit Bendigiri
AI Product Management by Abhijit BendigiriISPMAIndia
 
killingcamp longest common subsequence.pdf
killingcamp longest common subsequence.pdfkillingcamp longest common subsequence.pdf
killingcamp longest common subsequence.pdfssuser82c38d
 
The Game-Changer_ How Software Development Outsource Can Catapult Your Growth...
The Game-Changer_ How Software Development Outsource Can Catapult Your Growth...The Game-Changer_ How Software Development Outsource Can Catapult Your Growth...
The Game-Changer_ How Software Development Outsource Can Catapult Your Growth...emili denli
 
killing camp week 6 problem - maximal matrix.pdf
killing camp week 6 problem - maximal matrix.pdfkilling camp week 6 problem - maximal matrix.pdf
killing camp week 6 problem - maximal matrix.pdfssuser82c38d
 
P1 Inspection Types in Municity 5 Smartsheet
P1 Inspection Types in Municity 5 SmartsheetP1 Inspection Types in Municity 5 Smartsheet
P1 Inspection Types in Municity 5 SmartsheetMatthewTHawley
 
The Age of AI: Elevating Experiences & Delivering Customer Value!
The Age of AI: Elevating Experiences & Delivering Customer Value!The Age of AI: Elevating Experiences & Delivering Customer Value!
The Age of AI: Elevating Experiences & Delivering Customer Value!ISPMAIndia
 
Essence of Requirements Engineering: Pragmatic Insights for 2024
Essence of Requirements Engineering: Pragmatic Insights for 2024Essence of Requirements Engineering: Pragmatic Insights for 2024
Essence of Requirements Engineering: Pragmatic Insights for 2024Asher Sterkin
 
Open Sprintera (Where Open Source Sparks a Sprint of Possibilities)
Open Sprintera (Where Open Source Sparks a Sprint of Possibilities)Open Sprintera (Where Open Source Sparks a Sprint of Possibilities)
Open Sprintera (Where Open Source Sparks a Sprint of Possibilities)GDSCNiT
 
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ..."Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...ISPMAIndia
 
OpenChain AI Study Group - North America and Europe - 2024-02-20
OpenChain AI Study Group - North America and Europe - 2024-02-20OpenChain AI Study Group - North America and Europe - 2024-02-20
OpenChain AI Study Group - North America and Europe - 2024-02-20Shane Coughlan
 
maximum subarray ppt for killing camp students
maximum subarray ppt for killing camp studentsmaximum subarray ppt for killing camp students
maximum subarray ppt for killing camp studentsssuser82c38d
 
DBA Fundamentals Group: Continuous SQL with Kafka and Flink
DBA Fundamentals Group: Continuous SQL with Kafka and FlinkDBA Fundamentals Group: Continuous SQL with Kafka and Flink
DBA Fundamentals Group: Continuous SQL with Kafka and FlinkTimothy Spann
 
killingcamp 광고삽입문제 풀이, killingcamp 광고삽입문제 풀이
killingcamp 광고삽입문제 풀이, killingcamp 광고삽입문제 풀이killingcamp 광고삽입문제 풀이, killingcamp 광고삽입문제 풀이
killingcamp 광고삽입문제 풀이, killingcamp 광고삽입문제 풀이ssuser82c38d
 
Automation for Bonterra Impact Management (fka Apricot)
Automation for Bonterra Impact Management (fka Apricot)Automation for Bonterra Impact Management (fka Apricot)
Automation for Bonterra Impact Management (fka Apricot)Jeffrey Haguewood
 
100 TOOLS TO MEASURE AND ANALYSE YOUR DIGITAL MARKETING EFFORTS
100 TOOLS TO MEASURE AND ANALYSE YOUR DIGITAL MARKETING EFFORTS100 TOOLS TO MEASURE AND ANALYSE YOUR DIGITAL MARKETING EFFORTS
100 TOOLS TO MEASURE AND ANALYSE YOUR DIGITAL MARKETING EFFORTSi-engage
 
Embracing Change - The Impact of Generative AI on Strategic Portfolio Management
Embracing Change - The Impact of Generative AI on Strategic Portfolio ManagementEmbracing Change - The Impact of Generative AI on Strategic Portfolio Management
Embracing Change - The Impact of Generative AI on Strategic Portfolio ManagementOnePlan Solutions
 
AUTOKEYUNLOCKER-BRANDS-SUPPORT-STANDARD-VERSION.pdf
AUTOKEYUNLOCKER-BRANDS-SUPPORT-STANDARD-VERSION.pdfAUTOKEYUNLOCKER-BRANDS-SUPPORT-STANDARD-VERSION.pdf
AUTOKEYUNLOCKER-BRANDS-SUPPORT-STANDARD-VERSION.pdfAutokey
 
Getting Started with Trello for Beginners.pptx
Getting Started with Trello for Beginners.pptxGetting Started with Trello for Beginners.pptx
Getting Started with Trello for Beginners.pptxmavinoikein
 
Software Testing life cycle (STLC) Importance, Phases, Benefits...
Software Testing life cycle (STLC) Importance, Phases, Benefits...Software Testing life cycle (STLC) Importance, Phases, Benefits...
Software Testing life cycle (STLC) Importance, Phases, Benefits...Flexsin
 

Recently uploaded (20)

AI Product Management by Abhijit Bendigiri
AI Product Management by Abhijit BendigiriAI Product Management by Abhijit Bendigiri
AI Product Management by Abhijit Bendigiri
 
killingcamp longest common subsequence.pdf
killingcamp longest common subsequence.pdfkillingcamp longest common subsequence.pdf
killingcamp longest common subsequence.pdf
 
The Game-Changer_ How Software Development Outsource Can Catapult Your Growth...
The Game-Changer_ How Software Development Outsource Can Catapult Your Growth...The Game-Changer_ How Software Development Outsource Can Catapult Your Growth...
The Game-Changer_ How Software Development Outsource Can Catapult Your Growth...
 
killing camp week 6 problem - maximal matrix.pdf
killing camp week 6 problem - maximal matrix.pdfkilling camp week 6 problem - maximal matrix.pdf
killing camp week 6 problem - maximal matrix.pdf
 
P1 Inspection Types in Municity 5 Smartsheet
P1 Inspection Types in Municity 5 SmartsheetP1 Inspection Types in Municity 5 Smartsheet
P1 Inspection Types in Municity 5 Smartsheet
 
The Age of AI: Elevating Experiences & Delivering Customer Value!
The Age of AI: Elevating Experiences & Delivering Customer Value!The Age of AI: Elevating Experiences & Delivering Customer Value!
The Age of AI: Elevating Experiences & Delivering Customer Value!
 
Essence of Requirements Engineering: Pragmatic Insights for 2024
Essence of Requirements Engineering: Pragmatic Insights for 2024Essence of Requirements Engineering: Pragmatic Insights for 2024
Essence of Requirements Engineering: Pragmatic Insights for 2024
 
Open Sprintera (Where Open Source Sparks a Sprint of Possibilities)
Open Sprintera (Where Open Source Sparks a Sprint of Possibilities)Open Sprintera (Where Open Source Sparks a Sprint of Possibilities)
Open Sprintera (Where Open Source Sparks a Sprint of Possibilities)
 
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ..."Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
"Taking an idea to a Product in Health diagnostics" by Dr. Geetha Manjunath, ...
 
OpenChain AI Study Group - North America and Europe - 2024-02-20
OpenChain AI Study Group - North America and Europe - 2024-02-20OpenChain AI Study Group - North America and Europe - 2024-02-20
OpenChain AI Study Group - North America and Europe - 2024-02-20
 
maximum subarray ppt for killing camp students
maximum subarray ppt for killing camp studentsmaximum subarray ppt for killing camp students
maximum subarray ppt for killing camp students
 
DBA Fundamentals Group: Continuous SQL with Kafka and Flink
DBA Fundamentals Group: Continuous SQL with Kafka and FlinkDBA Fundamentals Group: Continuous SQL with Kafka and Flink
DBA Fundamentals Group: Continuous SQL with Kafka and Flink
 
killingcamp 광고삽입문제 풀이, killingcamp 광고삽입문제 풀이
killingcamp 광고삽입문제 풀이, killingcamp 광고삽입문제 풀이killingcamp 광고삽입문제 풀이, killingcamp 광고삽입문제 풀이
killingcamp 광고삽입문제 풀이, killingcamp 광고삽입문제 풀이
 
Automation for Bonterra Impact Management (fka Apricot)
Automation for Bonterra Impact Management (fka Apricot)Automation for Bonterra Impact Management (fka Apricot)
Automation for Bonterra Impact Management (fka Apricot)
 
100 TOOLS TO MEASURE AND ANALYSE YOUR DIGITAL MARKETING EFFORTS
100 TOOLS TO MEASURE AND ANALYSE YOUR DIGITAL MARKETING EFFORTS100 TOOLS TO MEASURE AND ANALYSE YOUR DIGITAL MARKETING EFFORTS
100 TOOLS TO MEASURE AND ANALYSE YOUR DIGITAL MARKETING EFFORTS
 
Embracing Change - The Impact of Generative AI on Strategic Portfolio Management
Embracing Change - The Impact of Generative AI on Strategic Portfolio ManagementEmbracing Change - The Impact of Generative AI on Strategic Portfolio Management
Embracing Change - The Impact of Generative AI on Strategic Portfolio Management
 
eLearning Content Development Company Code and Pixels.pdf
eLearning Content Development Company Code and Pixels.pdfeLearning Content Development Company Code and Pixels.pdf
eLearning Content Development Company Code and Pixels.pdf
 
AUTOKEYUNLOCKER-BRANDS-SUPPORT-STANDARD-VERSION.pdf
AUTOKEYUNLOCKER-BRANDS-SUPPORT-STANDARD-VERSION.pdfAUTOKEYUNLOCKER-BRANDS-SUPPORT-STANDARD-VERSION.pdf
AUTOKEYUNLOCKER-BRANDS-SUPPORT-STANDARD-VERSION.pdf
 
Getting Started with Trello for Beginners.pptx
Getting Started with Trello for Beginners.pptxGetting Started with Trello for Beginners.pptx
Getting Started with Trello for Beginners.pptx
 
Software Testing life cycle (STLC) Importance, Phases, Benefits...
Software Testing life cycle (STLC) Importance, Phases, Benefits...Software Testing life cycle (STLC) Importance, Phases, Benefits...
Software Testing life cycle (STLC) Importance, Phases, Benefits...
 

html-css

  • 2. WHAT IS CSS? CSS stands for “Cascading Style Sheets” Cascading refers to the procedure that determines which style will apply to a certain section, if you have more than one style rule. Style how you want a certain part of your page to look. You can set things like color, margins, font, etc for things like tables, paragraphs, and headings. Sheets the “sheets” are like templates, or a set of rules, for determining how the webpage will look. CSS is a stylesheet language used to describe the presentation of a document written in HTML or XML.
  • 3. Why Use CSS? • CSS is used to define styles for your web pages, including the design, layout and variations in display for different devices and screen sizes.
  • 4. • A web application will contains hundreds of web pages, which are created using HTML. • Formatting these HTML pages will be a laborious process, as formatting elements need to be applied to each and every page. • CSS saves lots of work as we can change the appearance and layout of all the web pages by editing just one single CSS file. Advantages
  • 6. • A CSS rule-set consists of 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. • Multiple CSS declarations are separated with semicolons, and declaration blocks are surrounded by curly braces.
  • 7. Example In this example all <p> elements will be center-aligned, with a red text color: p { color : red ; text-align : center; } Example Explained •p is a selector in CSS . •color is a property, and red is the property value •text-align is a property, and center is the property value
  • 9. CSS Syntax Rules Rule have two parts - Selector and declaration. Selector The HTML element you want to add style to. <p> <h1> <table> etc Declaration The statement of style for that element. Made up of property andvalue. Property Declaration V alue Rules Selector Declaration p { font-family : Arial ; }
  • 10. EXAMPLE <html> <head> <style> p {font-family:Arial; color: red; background-color:black;} </style> </head> <body> <p> <b> Welcome to Coder Decoder</b> </p> </body> </html> Welcome to Coder Decoder Selector - I want the text color of my paragraph to be red and the background color to be black.
  • 11. CSS SELECTORS Declaring a CSS Rule for a Elements Attribute It will style all the content of that element which you are selecting. Example The HTML <p> Welcome to the Coder Decoder </p> <p> <b><i> Powered by – Dhirendra Chauhan</i></b> </p> The CSS p {text-align: center; color: blue;}
  • 12. CSS SELECTORS Grouping Selectors You can group all the selectors of same style to minimize the code. The selectors should be separated with comma. Example h2 {text-align: center; color: red; } p {text-align: center; color: red;} Grouped Selectors h2, p { text-align: center; color: red; }
  • 13. INSERTING A STYLESHEET Three different ways 1. External Style Sheet 2. Internal Style Sheet 3. Inline Styles
  • 14. Inline CSS Inline CSS contains the CSS property in the body section attached with element is known as inline CSS. This kind of style is specified within an HTML tag using the style attribute. <html> <head> <title>Inline CSS</title> </head> <body> <p style = "color:#009900; font-size:50px; font-style:italic; text-align:center;"> Coder Decoder </p> </body> </html> Coder Decoder
  • 15. Internal or Embedded CSS An internal stylesheet holds CSS rules for the page in the head section of the HTML file. The rules only apply to that page, but we can configure CSS classes and IDs that can be used to style multiple elements in the page code.
  • 16. <head> <style type =“text / css”> h3 { font-style:bold; font-size:20px; } </style> </head>
  • 17. <html> <head> <title>Internal CSS</title> <style> .main { text-align:center; } .coder { font-style:bold; font-size:20px; } </style> </head> <body> <div class = "main"> <div class ="GFG">Mount Abu</div> <div class =“coder"> A computer science portal for Class X </div> </div> </body> </html>
  • 18. External CSS External CSS contains separate CSS file which contains only style property with the help of tag attributes ( For example class, id, heading, … etc ). An external ( also called linked ) style sheet carries essentially the same information as an internal style sheet in the sense that external style sheet is contained inn its own text file ( having extension .css )
  • 19. <html> <head> <link rel="stylesheet" href="mystyle.css"> </head> <body> <h1>Coder Decoder</h1> <p>This is a my Channel.</p> </body> </html> "mystyle.css" body { background-color: lightblue; } h1 { color: navy; margin-left: 20px; } Example
  • 20. CSS PROPERTIES CSS Background We can use CSS Background properties to define the background effects of an element. The following properties can be used for background effects : a. background-color b. background-image c. background-repeat d. background-position
  • 21. CSS Background Image You can use an image as the background for an element using background- image property. Example:- body{ background-image : url(‘java.png’); } CSS PROPERTIES
  • 22. CSS Background Color The background-color property is used to specify the background color of an element. Example: body { background-color : darkblue; } p { background-color : orange; } CSS PROPERTIES
  • 23. CSS Background Position If the background image disturbs the text, i.e. if the text cannot be read clearly due to the image in the background, we can set the position of the background image. Example: body { background-image :url(“CoderDecoder.jpg"); background-repeat : no-repeat; background-position :right top; } CSS PROPERTIES
  • 24. Text Alignment We can either align the text to the left, right, center or we can make it justified. Example- p { text-align : left;} h1{text-align : center;} Text Color The color property is used to set the color of text. Example- body{ color : blue;} p1 { color : magenta;} CSS PROPERTIES
  • 25. Text Formatting The following properties can be used for formatting text : 1. Text Color 2. Text Alignment 3. Text Decoration 4. Text Transformation 5. Text Indentation CSS PROPERTIES
  • 26. Text Decoration You can use text-decoration property to set or remove decorations from text. Example- p {text-decoration:overline;} p {text-decoration:line-through;} p {text-decoration:underline;} Text Transformation You can use text-transform property to specify uppercase and lowercase letters of any text. Example- h1 {text-transform:uppercase;} h2 {text-transform:lowercase;} p {text-transform:capitalize;} CSS PROPERTIES
  • 27. CSS Font Size You can use the font-size property to set the size of text. The font-size value can be absolute or it can be relative. Example h1 { font-size: 30px; } p { font-size: 14px; } CSS PROPERTIES
  • 28. CSS Links You can use CSSstyles to style any link. Links can be styled in different waysby using any CSSproperty like color, font-family etc. Links can be in one of the following states :  a : link – Unvisited link  a : visited – Alink that the user has visited  a : hover – Alink over which the mouse pointer is moving  a : active – Alink, which has been just clicked CSS PROPERTIES
  • 29. CSS Links a { font-weight: bold; } a : link { color: black; } a : visited { color : gray; } a:hover { text-decoration: none; color: white; background-color: navy; } a : active { color: aqua; background-color : navy; } Styling Links link - before a visit visited - after it has been visited hover - when your mouse is over it but you have not clicked active - you have clicked it and you have not yet seen the new page CSS PROPERTIES
  • 30. CSS List We can use CSSlist properties for  Setting different list item markers for ordered lists  Setting different list item markers for unordered lists  Set an image as the list item marker Values  list-style-type  list-style-image CSS PROPERTIES
  • 31. CSS Border You can use the CSS Border properties to specify the style and color of an element’s border. Values 1. border-style 2. border-width 3. border-color CSS PROPERTIES
  • 32. CSS Margin Using CSSMargin properties you can specify the space around elements. Values: margin-top:50px; margin-bottom:30px; margin-right:25px; margin-left:10px; CSS PROPERTIES