SlideShare ist ein Scribd-Unternehmen logo
1 von 16
Web Development using HTML and CSS
SIDDHANT SINGH
ENROLLMENT NO - 1901460118
What is Web development?
 Web development usually refers to developing the website for the internet.
 Also known as web programming and it is the creation of dynamic web applications.
 Examples of web applications are facebook or e-commerce site like amazon, etc.
 The main division of web development is front-end development which is also called as client-side development.
Front end development.
 Front-end development refers to producing a web application so that a user can see and interact with them directly.
 The objective of designing a site is to ensure that when the users open up the site they see the information in a format
that is easy to read and relevant.
 The technologies we can use here are – HTML,CSS.
What is HTML?
• HTML stands for Hyper Text Markup Language
• It is the standard markup language for creating Web pages
• It describes the structure of a Web page
• It consists of a series of elements
• Html elements tell the browser how to display the content.
A Simple Html Document.
Example Explained
•The <html> element is the root element of an HTML page
•The <head> element contains meta information about the HTML page
•The <title> element specifies a title for the HTML page (which is shown in the browser's title bar or in the page's tab)
•The <body> element defines the document's body, and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks,
tables, lists, etc.
Use and Importance of Html.
• HTML is the foundation of a website it contains the information that tells the browser what is on the page in terms of text, links,
where to find images. html is a platform independence means it is possible to create html file on any computer (like windows, Mac
os,etc)with any editor.it is easy to learn because its have a simple structures and it is easy to understand.
• HTML allow video, image and other files to be embedded which is used to create interactive web pages. HTML also embed scripts and
styles, scripts affect the behavior of HTML web pages and styles (Cascading Style Sheets) define the look and layout of web pages.
What is 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
Use of CSS.
CSS is the language for describing the presentation of Web pages, including colors, layout, and fonts. It allows
one to adapt the presentation to different types of devices, such as large screens, small screens, or printers. CSS
is independent of HTML and can be used with any XML-based markup language.
CSS Demo – Same page Different Style.
Here the content is same but The presentation style is different.
File – Extensions for Html and Css
• An HTML file is nothing more than plain ASCII text, but all HTML files must have a special file extension for web
browsers to recognize them. This extension is . html.
• When the html document is created and one want to style it than he/she can do it by creating a file named style or
anything by adding the extension .CSS.
Code – Editors.
• Installation process is not a task in html and css by just adding the .html and .css extension the browser will recognize.
• Html and Css can be done only using Notepad but to increase the speed and for convenience Many code – editors
were developed.
• Eg - 1. Vs code.
• 2. Atom.
• 3. Notepad ++.
• 4. Sublime Text.
Some more Examples of html.
Understanding the tags used in Example.
• The heading tags indicate heading on a web page and they are from h1 to h6.
• HTML paragraph or HTML p tag is used to define a paragraph in a webpage.
• <ul> - Defines an unordered list.
• <ol> - Defines an Ordered list.
• <li> - Defines a list item.
• The <body> tag defines the document's body.
Some example of css.
• If we see the previous example we have used class selector and group selector.
• The class selector selects HTML elements with a specific class attribute.
• The grouping selector selects all the HTML elements with the same style definitions.
• The universal selector (*) selects all HTML elements on the page. This is used when the user wants same style all over
the page.
Thank you.

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
CSS
CSSCSS
CSS
 
Html
HtmlHtml
Html
 
Html and css presentation
Html and css presentationHtml and css presentation
Html and css presentation
 
Complete Lecture on Css presentation
Complete Lecture on Css presentation Complete Lecture on Css presentation
Complete Lecture on Css presentation
 
HTML CSS Basics
HTML CSS BasicsHTML CSS Basics
HTML CSS Basics
 
Intro to HTML and CSS basics
Intro to HTML and CSS basicsIntro to HTML and CSS basics
Intro to HTML and CSS basics
 
Html / CSS Presentation
Html / CSS PresentationHtml / CSS Presentation
Html / CSS Presentation
 
HTML-(workshop)7557.pptx
HTML-(workshop)7557.pptxHTML-(workshop)7557.pptx
HTML-(workshop)7557.pptx
 
Introduction of Html/css/js
Introduction of Html/css/jsIntroduction of Html/css/js
Introduction of Html/css/js
 
Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS)Cascading Style Sheet (CSS)
Cascading Style Sheet (CSS)
 
Html TAGS
Html TAGSHtml TAGS
Html TAGS
 
Css Ppt
Css PptCss Ppt
Css Ppt
 
Html
HtmlHtml
Html
 
Html Ppt
Html PptHtml Ppt
Html Ppt
 
Html5 Basics
Html5 BasicsHtml5 Basics
Html5 Basics
 
Cascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) helpCascading Style Sheets (CSS) help
Cascading Style Sheets (CSS) help
 
Javascript
JavascriptJavascript
Javascript
 
Html
HtmlHtml
Html
 

Ähnlich wie Web development using HTML and CSS

Html power point
Html power pointHtml power point
Html power point
markbg
 

Ähnlich wie Web development using HTML and CSS (20)

Web Concepts - an introduction - introduction
Web Concepts - an introduction - introductionWeb Concepts - an introduction - introduction
Web Concepts - an introduction - introduction
 
02 From HTML tags to XHTML
02 From HTML tags to XHTML02 From HTML tags to XHTML
02 From HTML tags to XHTML
 
HTML.pptx
HTML.pptxHTML.pptx
HTML.pptx
 
Html-meeting1-1.pptx
Html-meeting1-1.pptxHtml-meeting1-1.pptx
Html-meeting1-1.pptx
 
Introduction To HTML
Introduction To HTMLIntroduction To HTML
Introduction To HTML
 
What Is the Use Of HTML.pptx
What Is the Use Of HTML.pptxWhat Is the Use Of HTML.pptx
What Is the Use Of HTML.pptx
 
Iwt module 1
Iwt  module 1Iwt  module 1
Iwt module 1
 
Unit 01 (1).pdf
Unit 01 (1).pdfUnit 01 (1).pdf
Unit 01 (1).pdf
 
Web development using html and wordpress
Web development using html and wordpressWeb development using html and wordpress
Web development using html and wordpress
 
Html
HtmlHtml
Html
 
HTML & CSS.ppt
HTML & CSS.pptHTML & CSS.ppt
HTML & CSS.ppt
 
Grade 10 COMPUTER
Grade 10 COMPUTERGrade 10 COMPUTER
Grade 10 COMPUTER
 
WELCOME-FOLKS--CSS.-AND-HTMLS.pptx
WELCOME-FOLKS--CSS.-AND-HTMLS.pptxWELCOME-FOLKS--CSS.-AND-HTMLS.pptx
WELCOME-FOLKS--CSS.-AND-HTMLS.pptx
 
Introduction css
Introduction cssIntroduction css
Introduction css
 
Introduction css
Introduction cssIntroduction css
Introduction css
 
Html power point
Html power pointHtml power point
Html power point
 
HTML and CSS 2.0 .pdf
HTML and CSS 2.0 .pdfHTML and CSS 2.0 .pdf
HTML and CSS 2.0 .pdf
 
Ndim1 2009 Web Design
Ndim1 2009 Web DesignNdim1 2009 Web Design
Ndim1 2009 Web Design
 
Pm shandilya-s-wcodew-web-methodology
Pm shandilya-s-wcodew-web-methodologyPm shandilya-s-wcodew-web-methodology
Pm shandilya-s-wcodew-web-methodology
 
Intro to HTML & CSS
Intro to HTML & CSSIntro to HTML & CSS
Intro to HTML & CSS
 

Kürzlich hochgeladen

AKTU Computer Networks notes --- Unit 3.pdf
AKTU Computer Networks notes ---  Unit 3.pdfAKTU Computer Networks notes ---  Unit 3.pdf
AKTU Computer Networks notes --- Unit 3.pdf
ankushspencer015
 

Kürzlich hochgeladen (20)

CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete Record
CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete RecordCCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete Record
CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete Record
 
MANUFACTURING PROCESS-II UNIT-2 LATHE MACHINE
MANUFACTURING PROCESS-II UNIT-2 LATHE MACHINEMANUFACTURING PROCESS-II UNIT-2 LATHE MACHINE
MANUFACTURING PROCESS-II UNIT-2 LATHE MACHINE
 
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...
 
The Most Attractive Pune Call Girls Manchar 8250192130 Will You Miss This Cha...
The Most Attractive Pune Call Girls Manchar 8250192130 Will You Miss This Cha...The Most Attractive Pune Call Girls Manchar 8250192130 Will You Miss This Cha...
The Most Attractive Pune Call Girls Manchar 8250192130 Will You Miss This Cha...
 
AKTU Computer Networks notes --- Unit 3.pdf
AKTU Computer Networks notes ---  Unit 3.pdfAKTU Computer Networks notes ---  Unit 3.pdf
AKTU Computer Networks notes --- Unit 3.pdf
 
(INDIRA) Call Girl Aurangabad Call Now 8617697112 Aurangabad Escorts 24x7
(INDIRA) Call Girl Aurangabad Call Now 8617697112 Aurangabad Escorts 24x7(INDIRA) Call Girl Aurangabad Call Now 8617697112 Aurangabad Escorts 24x7
(INDIRA) Call Girl Aurangabad Call Now 8617697112 Aurangabad Escorts 24x7
 
Glass Ceramics: Processing and Properties
Glass Ceramics: Processing and PropertiesGlass Ceramics: Processing and Properties
Glass Ceramics: Processing and Properties
 
UNIT - IV - Air Compressors and its Performance
UNIT - IV - Air Compressors and its PerformanceUNIT - IV - Air Compressors and its Performance
UNIT - IV - Air Compressors and its Performance
 
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur Escorts
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur EscortsCall Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur Escorts
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur Escorts
 
Booking open Available Pune Call Girls Koregaon Park 6297143586 Call Hot Ind...
Booking open Available Pune Call Girls Koregaon Park  6297143586 Call Hot Ind...Booking open Available Pune Call Girls Koregaon Park  6297143586 Call Hot Ind...
Booking open Available Pune Call Girls Koregaon Park 6297143586 Call Hot Ind...
 
Roadmap to Membership of RICS - Pathways and Routes
Roadmap to Membership of RICS - Pathways and RoutesRoadmap to Membership of RICS - Pathways and Routes
Roadmap to Membership of RICS - Pathways and Routes
 
BSides Seattle 2024 - Stopping Ethan Hunt From Taking Your Data.pptx
BSides Seattle 2024 - Stopping Ethan Hunt From Taking Your Data.pptxBSides Seattle 2024 - Stopping Ethan Hunt From Taking Your Data.pptx
BSides Seattle 2024 - Stopping Ethan Hunt From Taking Your Data.pptx
 
Processing & Properties of Floor and Wall Tiles.pptx
Processing & Properties of Floor and Wall Tiles.pptxProcessing & Properties of Floor and Wall Tiles.pptx
Processing & Properties of Floor and Wall Tiles.pptx
 
Extrusion Processes and Their Limitations
Extrusion Processes and Their LimitationsExtrusion Processes and Their Limitations
Extrusion Processes and Their Limitations
 
Booking open Available Pune Call Girls Pargaon 6297143586 Call Hot Indian Gi...
Booking open Available Pune Call Girls Pargaon  6297143586 Call Hot Indian Gi...Booking open Available Pune Call Girls Pargaon  6297143586 Call Hot Indian Gi...
Booking open Available Pune Call Girls Pargaon 6297143586 Call Hot Indian Gi...
 
Introduction and different types of Ethernet.pptx
Introduction and different types of Ethernet.pptxIntroduction and different types of Ethernet.pptx
Introduction and different types of Ethernet.pptx
 
UNIT-II FMM-Flow Through Circular Conduits
UNIT-II FMM-Flow Through Circular ConduitsUNIT-II FMM-Flow Through Circular Conduits
UNIT-II FMM-Flow Through Circular Conduits
 
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...
 
MANUFACTURING PROCESS-II UNIT-1 THEORY OF METAL CUTTING
MANUFACTURING PROCESS-II UNIT-1 THEORY OF METAL CUTTINGMANUFACTURING PROCESS-II UNIT-1 THEORY OF METAL CUTTING
MANUFACTURING PROCESS-II UNIT-1 THEORY OF METAL CUTTING
 
College Call Girls Nashik Nehal 7001305949 Independent Escort Service Nashik
College Call Girls Nashik Nehal 7001305949 Independent Escort Service NashikCollege Call Girls Nashik Nehal 7001305949 Independent Escort Service Nashik
College Call Girls Nashik Nehal 7001305949 Independent Escort Service Nashik
 

Web development using HTML and CSS

  • 1. Web Development using HTML and CSS SIDDHANT SINGH ENROLLMENT NO - 1901460118
  • 2. What is Web development?  Web development usually refers to developing the website for the internet.  Also known as web programming and it is the creation of dynamic web applications.  Examples of web applications are facebook or e-commerce site like amazon, etc.  The main division of web development is front-end development which is also called as client-side development.
  • 3. Front end development.  Front-end development refers to producing a web application so that a user can see and interact with them directly.  The objective of designing a site is to ensure that when the users open up the site they see the information in a format that is easy to read and relevant.  The technologies we can use here are – HTML,CSS.
  • 4. What is HTML? • HTML stands for Hyper Text Markup Language • It is the standard markup language for creating Web pages • It describes the structure of a Web page • It consists of a series of elements • Html elements tell the browser how to display the content.
  • 5. A Simple Html Document. Example Explained •The <html> element is the root element of an HTML page •The <head> element contains meta information about the HTML page •The <title> element specifies a title for the HTML page (which is shown in the browser's title bar or in the page's tab) •The <body> element defines the document's body, and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
  • 6. Use and Importance of Html. • HTML is the foundation of a website it contains the information that tells the browser what is on the page in terms of text, links, where to find images. html is a platform independence means it is possible to create html file on any computer (like windows, Mac os,etc)with any editor.it is easy to learn because its have a simple structures and it is easy to understand. • HTML allow video, image and other files to be embedded which is used to create interactive web pages. HTML also embed scripts and styles, scripts affect the behavior of HTML web pages and styles (Cascading Style Sheets) define the look and layout of web pages.
  • 7. What is 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
  • 8. Use of CSS. CSS is the language for describing the presentation of Web pages, including colors, layout, and fonts. It allows one to adapt the presentation to different types of devices, such as large screens, small screens, or printers. CSS is independent of HTML and can be used with any XML-based markup language.
  • 9. CSS Demo – Same page Different Style. Here the content is same but The presentation style is different.
  • 10. File – Extensions for Html and Css • An HTML file is nothing more than plain ASCII text, but all HTML files must have a special file extension for web browsers to recognize them. This extension is . html. • When the html document is created and one want to style it than he/she can do it by creating a file named style or anything by adding the extension .CSS.
  • 11. Code – Editors. • Installation process is not a task in html and css by just adding the .html and .css extension the browser will recognize. • Html and Css can be done only using Notepad but to increase the speed and for convenience Many code – editors were developed. • Eg - 1. Vs code. • 2. Atom. • 3. Notepad ++. • 4. Sublime Text.
  • 12. Some more Examples of html.
  • 13. Understanding the tags used in Example. • The heading tags indicate heading on a web page and they are from h1 to h6. • HTML paragraph or HTML p tag is used to define a paragraph in a webpage. • <ul> - Defines an unordered list. • <ol> - Defines an Ordered list. • <li> - Defines a list item. • The <body> tag defines the document's body.
  • 15. • If we see the previous example we have used class selector and group selector. • The class selector selects HTML elements with a specific class attribute. • The grouping selector selects all the HTML elements with the same style definitions. • The universal selector (*) selects all HTML elements on the page. This is used when the user wants same style all over the page.