SlideShare a Scribd company logo
6.53
CSS
WHAT IS CSS
CSS stands for Cascading
Style Sheets. It is a style sheet
language which is used to
describe the look and
formatting of a document
written in markup language.
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.
7/1/20XX 2
WHAT DOES CSS
DO?
•You can add new looks to
your old HTML documents.
•You can completely
change the look of your
website with only a few
changes in CSS code.
7/1/20XX 3
WHY USE CSS
THESE ARE THE THREE MAJOR BENEFITS OF CSS:
7/1/20XX 4
1)
Solves a
big
problem
2) Saves
a lot of
time
3) Provide
more
attributes
CSS SYNTAX
A CSS RULE SET CONTAINS A SELECTOR AND A DECLARATION BLOCK.
THERE ARE THREE TYPES OF CSS
• Inline CSS
• Internal or Embedded CSS
• External CSS
INLINE CSS
<!DOCTYPE html>
<html>
<head>
<title>Inline CSS</title>
</head>
<body>
<p style = "color:#009900; font-size:50px;
font-style:italic; text-align:center;">
ComSci
</p>
</body>
</html>
INTERNAL OR EMBEDDED CSS
<!DOCTYPE html>
<html>
<head>
<title>Internal CSS</title>
<style>
.main {
text-align:center;
}
.GFG {
color:#009900;
font-size:50px;
font-weight:bold;
}
.geeks {
font-style:bold;
font-size:20px;
}
</style>
</head>
<body>
<div class = "main">
<div class ="GFG">GeeksForGeeks</div>
<div class ="geeks">
A computer science portal for geeks
</div>
</div>
</body>
</html>
EXTERNAL CSS
body { background-color:powderblue; }
.main { text-align:center; }
.bg { color:#009900; font-size:50px; font-
weight:bold; }
#text { font-style:bold; font-size:20px; }
ADDING CSS IN HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href=“oms.css"/>
</head>
<body>
<div class = "main">
<div class =“gg">HEllo</div>
<div id ="geeks">
Aim High ComSci
</div>
</div>
</body>
</html>
THANK YOU
7/1/20XX Pitch deck title 11

More Related Content

Similar to MYSQL DATABASE MYSQL DATABASE MYSQL DATABASECSS.pptx (20)

PPTX
intro_To_HTML_and__CSS_using_presentation.pptx
AsrithaKorupolu
 
PPTX
Unit iii css and javascript 1
Jesus Obenita Jr.
 
PPTX
Web programming css
Uma mohan
 
PDF
HowTo_CSS
tutorialsruby
 
PDF
HowTo_CSS
tutorialsruby
 
PDF
Girl Develop It Cincinnati: Intro to HTML/CSS Class 4
Erin M. Kidwell
 
PPTX
Cascading Style Sheets(CSS).pptx by kj frm changa
Krupal8
 
PDF
Full
sanjaykhan33
 
PPTX
Css introduction
AbhishekMondal42
 
PPTX
Css home
AbhishekMondal42
 
PPTX
SCSS Implementation
Amey Parab
 
PPT
New Css style
BUDNET
 
PPTX
Web designing training in chandigarh
Sheetal Sharma
 
PPT
Css
zayhard99
 
PPT
CSS.ppt
MukulSingh293955
 
PPTX
VAP ppt.pptx
DhruvGaur24
 
PPTX
pras ppjznsms zkskmssia znjzmsmsmkM JKamens
RudreshPvb
 
PDF
Advanced Web Programming Chapter 8
RohanMistry15
 
PPTX
Introduction to Wed System And Technologies (1).pptx
AmeerHamza183012
 
PDF
Cascading Style Sheets for web development
atokoosetaiwoboluwat
 
intro_To_HTML_and__CSS_using_presentation.pptx
AsrithaKorupolu
 
Unit iii css and javascript 1
Jesus Obenita Jr.
 
Web programming css
Uma mohan
 
HowTo_CSS
tutorialsruby
 
HowTo_CSS
tutorialsruby
 
Girl Develop It Cincinnati: Intro to HTML/CSS Class 4
Erin M. Kidwell
 
Cascading Style Sheets(CSS).pptx by kj frm changa
Krupal8
 
Css introduction
AbhishekMondal42
 
SCSS Implementation
Amey Parab
 
New Css style
BUDNET
 
Web designing training in chandigarh
Sheetal Sharma
 
VAP ppt.pptx
DhruvGaur24
 
pras ppjznsms zkskmssia znjzmsmsmkM JKamens
RudreshPvb
 
Advanced Web Programming Chapter 8
RohanMistry15
 
Introduction to Wed System And Technologies (1).pptx
AmeerHamza183012
 
Cascading Style Sheets for web development
atokoosetaiwoboluwat
 

More from ArjayBalberan1 (20)

PDF
PPE-Module-1.2 PPE-Module-1.2 PPE-Module-1.2.pdf
ArjayBalberan1
 
PDF
PPE-Module-1.1 PPE-Module-1.1 PPE-Module-1.1.pdf
ArjayBalberan1
 
PPTX
LESSON 5 LESSON 5 LESSON 5 LESSON 5.pptx
ArjayBalberan1
 
PPTX
LESSON 1 AUTOMATA LESSON 1 AUTOMATA.pptx
ArjayBalberan1
 
PPTX
AUTOMATA AUTOMATA Automata10Chapter-8-and-9.pptx
ArjayBalberan1
 
PPTX
AUTOMATA AUTOMATA AUTOMATAAutomata9Chapter8.pptx
ArjayBalberan1
 
PPTX
AUTOMATA AUTOMATA Automata8Chapter7.pptx
ArjayBalberan1
 
PPTX
AUTOMATA AUTOMATA AUTOMATAAutomata7Chapter6.pptx
ArjayBalberan1
 
PPTX
AUTOMATA AUTOMATA AUTOMATA Automata6Chapter5.pptx
ArjayBalberan1
 
PPTX
AUTOMATA AUTOMATA Automata5Chapter4.pptx
ArjayBalberan1
 
PPTX
AUTOMATA AUTOMATA Automata4Chapter3.pptx
ArjayBalberan1
 
PPTX
AUTOMATA THEORY AUTOMATA THEORYAutomata3Chapter2.pptx
ArjayBalberan1
 
PPTX
automata theory and formal languages Automata2Chapter1.pptx
ArjayBalberan1
 
PPTX
Group-1 (1) Group-1 (1) Group-1 (1)Group-1 (1).pptx
ArjayBalberan1
 
PPTX
Introduction to Algorithms Introduction to Algorithms.pptx
ArjayBalberan1
 
PPTX
MYSQL DATABASE MYSQL DATABASEGroup-1.pptx
ArjayBalberan1
 
PPTX
Appdev appdev appdev app devAPPDEV 1.2.pptx
ArjayBalberan1
 
PPTX
Rizals-Family-Childhood-Early-Education.pptx
ArjayBalberan1
 
PPTX
MYSQL DATABASE Operating System Part2 (1).pptx
ArjayBalberan1
 
PPTX
MYSQL DATABASE APP DEV POWERPOINT 1.pptx
ArjayBalberan1
 
PPE-Module-1.2 PPE-Module-1.2 PPE-Module-1.2.pdf
ArjayBalberan1
 
PPE-Module-1.1 PPE-Module-1.1 PPE-Module-1.1.pdf
ArjayBalberan1
 
LESSON 5 LESSON 5 LESSON 5 LESSON 5.pptx
ArjayBalberan1
 
LESSON 1 AUTOMATA LESSON 1 AUTOMATA.pptx
ArjayBalberan1
 
AUTOMATA AUTOMATA Automata10Chapter-8-and-9.pptx
ArjayBalberan1
 
AUTOMATA AUTOMATA AUTOMATAAutomata9Chapter8.pptx
ArjayBalberan1
 
AUTOMATA AUTOMATA Automata8Chapter7.pptx
ArjayBalberan1
 
AUTOMATA AUTOMATA AUTOMATAAutomata7Chapter6.pptx
ArjayBalberan1
 
AUTOMATA AUTOMATA AUTOMATA Automata6Chapter5.pptx
ArjayBalberan1
 
AUTOMATA AUTOMATA Automata5Chapter4.pptx
ArjayBalberan1
 
AUTOMATA AUTOMATA Automata4Chapter3.pptx
ArjayBalberan1
 
AUTOMATA THEORY AUTOMATA THEORYAutomata3Chapter2.pptx
ArjayBalberan1
 
automata theory and formal languages Automata2Chapter1.pptx
ArjayBalberan1
 
Group-1 (1) Group-1 (1) Group-1 (1)Group-1 (1).pptx
ArjayBalberan1
 
Introduction to Algorithms Introduction to Algorithms.pptx
ArjayBalberan1
 
MYSQL DATABASE MYSQL DATABASEGroup-1.pptx
ArjayBalberan1
 
Appdev appdev appdev app devAPPDEV 1.2.pptx
ArjayBalberan1
 
Rizals-Family-Childhood-Early-Education.pptx
ArjayBalberan1
 
MYSQL DATABASE Operating System Part2 (1).pptx
ArjayBalberan1
 
MYSQL DATABASE APP DEV POWERPOINT 1.pptx
ArjayBalberan1
 
Ad

Recently uploaded (20)

PDF
AI Agents in the Cloud: The Rise of Agentic Cloud Architecture
Lilly Gracia
 
PDF
Newgen 2022-Forrester Newgen TEI_13 05 2022-The-Total-Economic-Impact-Newgen-...
darshakparmar
 
PDF
The Rise of AI and IoT in Mobile App Tech.pdf
IMG Global Infotech
 
PDF
Peak of Data & AI Encore AI-Enhanced Workflows for the Real World
Safe Software
 
PPTX
Designing_the_Future_AI_Driven_Product_Experiences_Across_Devices.pptx
presentifyai
 
PDF
LOOPS in C Programming Language - Technology
RishabhDwivedi43
 
PDF
Bitcoin for Millennials podcast with Bram, Power Laws of Bitcoin
Stephen Perrenod
 
PDF
“Voice Interfaces on a Budget: Building Real-time Speech Recognition on Low-c...
Edge AI and Vision Alliance
 
DOCX
Python coding for beginners !! Start now!#
Rajni Bhardwaj Grover
 
PDF
🚀 Let’s Build Our First Slack Workflow! 🔧.pdf
SanjeetMishra29
 
PDF
Go Concurrency Real-World Patterns, Pitfalls, and Playground Battles.pdf
Emily Achieng
 
PDF
Transcript: Book industry state of the nation 2025 - Tech Forum 2025
BookNet Canada
 
DOCX
Cryptography Quiz: test your knowledge of this important security concept.
Rajni Bhardwaj Grover
 
PPTX
COMPARISON OF RASTER ANALYSIS TOOLS OF QGIS AND ARCGIS
Sharanya Sarkar
 
PDF
Automating Feature Enrichment and Station Creation in Natural Gas Utility Net...
Safe Software
 
PPTX
AI Penetration Testing Essentials: A Cybersecurity Guide for 2025
defencerabbit
 
PPTX
From Sci-Fi to Reality: Exploring AI Evolution
Svetlana Meissner
 
PPTX
New ThousandEyes Product Innovations: Cisco Live June 2025
ThousandEyes
 
PDF
Newgen Beyond Frankenstein_Build vs Buy_Digital_version.pdf
darshakparmar
 
PDF
CIFDAQ Market Wrap for the week of 4th July 2025
CIFDAQ
 
AI Agents in the Cloud: The Rise of Agentic Cloud Architecture
Lilly Gracia
 
Newgen 2022-Forrester Newgen TEI_13 05 2022-The-Total-Economic-Impact-Newgen-...
darshakparmar
 
The Rise of AI and IoT in Mobile App Tech.pdf
IMG Global Infotech
 
Peak of Data & AI Encore AI-Enhanced Workflows for the Real World
Safe Software
 
Designing_the_Future_AI_Driven_Product_Experiences_Across_Devices.pptx
presentifyai
 
LOOPS in C Programming Language - Technology
RishabhDwivedi43
 
Bitcoin for Millennials podcast with Bram, Power Laws of Bitcoin
Stephen Perrenod
 
“Voice Interfaces on a Budget: Building Real-time Speech Recognition on Low-c...
Edge AI and Vision Alliance
 
Python coding for beginners !! Start now!#
Rajni Bhardwaj Grover
 
🚀 Let’s Build Our First Slack Workflow! 🔧.pdf
SanjeetMishra29
 
Go Concurrency Real-World Patterns, Pitfalls, and Playground Battles.pdf
Emily Achieng
 
Transcript: Book industry state of the nation 2025 - Tech Forum 2025
BookNet Canada
 
Cryptography Quiz: test your knowledge of this important security concept.
Rajni Bhardwaj Grover
 
COMPARISON OF RASTER ANALYSIS TOOLS OF QGIS AND ARCGIS
Sharanya Sarkar
 
Automating Feature Enrichment and Station Creation in Natural Gas Utility Net...
Safe Software
 
AI Penetration Testing Essentials: A Cybersecurity Guide for 2025
defencerabbit
 
From Sci-Fi to Reality: Exploring AI Evolution
Svetlana Meissner
 
New ThousandEyes Product Innovations: Cisco Live June 2025
ThousandEyes
 
Newgen Beyond Frankenstein_Build vs Buy_Digital_version.pdf
darshakparmar
 
CIFDAQ Market Wrap for the week of 4th July 2025
CIFDAQ
 
Ad

MYSQL DATABASE MYSQL DATABASE MYSQL DATABASECSS.pptx

  • 2. WHAT IS CSS CSS stands for Cascading Style Sheets. It is a style sheet language which is used to describe the look and formatting of a document written in markup language. 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. 7/1/20XX 2
  • 3. WHAT DOES CSS DO? •You can add new looks to your old HTML documents. •You can completely change the look of your website with only a few changes in CSS code. 7/1/20XX 3
  • 4. WHY USE CSS THESE ARE THE THREE MAJOR BENEFITS OF CSS: 7/1/20XX 4 1) Solves a big problem 2) Saves a lot of time 3) Provide more attributes
  • 5. CSS SYNTAX A CSS RULE SET CONTAINS A SELECTOR AND A DECLARATION BLOCK.
  • 6. THERE ARE THREE TYPES OF CSS • Inline CSS • Internal or Embedded CSS • External CSS
  • 7. INLINE CSS <!DOCTYPE html> <html> <head> <title>Inline CSS</title> </head> <body> <p style = "color:#009900; font-size:50px; font-style:italic; text-align:center;"> ComSci </p> </body> </html>
  • 8. INTERNAL OR EMBEDDED CSS <!DOCTYPE html> <html> <head> <title>Internal CSS</title> <style> .main { text-align:center; } .GFG { color:#009900; font-size:50px; font-weight:bold; } .geeks { font-style:bold; font-size:20px; } </style> </head> <body> <div class = "main"> <div class ="GFG">GeeksForGeeks</div> <div class ="geeks"> A computer science portal for geeks </div> </div> </body> </html>
  • 9. EXTERNAL CSS body { background-color:powderblue; } .main { text-align:center; } .bg { color:#009900; font-size:50px; font- weight:bold; } #text { font-style:bold; font-size:20px; }
  • 10. ADDING CSS IN HTML <!DOCTYPE html> <html> <head> <link rel="stylesheet" href=“oms.css"/> </head> <body> <div class = "main"> <div class =“gg">HEllo</div> <div id ="geeks"> Aim High ComSci </div> </div> </body> </html>
  • 11. THANK YOU 7/1/20XX Pitch deck title 11

Editor's Notes

  • #5: Before CSS, tags like font, color, background style, element alignments, border and size had to be repeated on every web page. This was a very long process. For example: If you are developing a large website where fonts and color information are added on every single page, it will be become a long and expensive process.  CSS style definitions are saved in external CSS files so it is possible to change the entire website by changing just one file. CSS provides more detailed attributes than plain HTML to define the look and feel of the website.
  • #6: Selector: Selector indicates the HTML element you want to style. It could be any tag like <h1>, <title> etc. Declaration Block: The declaration block can contain one or more declarations separated by a semicolon. For the above example, there are two declarations: color: yellow; font-size: 11 px; Each declaration contains a property name and value, separated by a colon. Property: A Property is a type of attribute of HTML element. It could be color, border etc. Value: Values are assigned to CSS properties. In the above example, value "yellow" is assigned to color property.
  • #7: Inline CSS: Inline CSS contains the CSS property in the body section attached with element is known as inline CSS. Internal or Embedded CSS: This can be used when a single HTML document must be styled uniquely. The CSS rule set should be within the HTML file in the head section i.e the CSS is embedded within the HTML file.  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). CSS property written in a separate file with .css extension and should be linked to the HTML document using link tag. 
  • #11: Created external style sheet   link tag is used to link the external style sheet with the html webpage. href attribute is used to specify the location of the external style sheet file.