SlideShare ist ein Scribd-Unternehmen logo
1 von 18
Ayes Chinmay
Internet
&
Web Technology
(HTML and CSS)
IWT Syllabus:
Module 1:
Web:
Internet, Word Wide Web(WWW), History of the Internet, History of the Web, Protocols Governing the Web, Types of
Websites, Web Applications, Web Projects, Web architecture, HTML, URI, HTTP, Issues in Web Development,
Webserver, web browser, Internet standards, TCP/IP Protocol suite, MIME, Cyber Laws.
Hyper Text Transfer Protocol(HTTP):
Understand the need for HTTP, URL and it Anatomy, HTTP message format, Persistent and Non-persistent Connections,
Web Caching, Proxy
Web Page Designing HTML:
Introduction to HTML, Mark up Language, HTML Tags, HTML Document Structure, HTML Comments, head, title, base,
link, style, meta, script, Heading tags, paragraph, anchor, image, video, line breaks, text formatting, lists, frames, forms.
Cascaded Style Sheet
Inline Styles, Internal Style Sheet, External Style Sheet, Selectors, Colors, Backgrounds, Background Image, Background
Attachment, Background Shorthand, Borders, Margins, Padding, Fonts, Links, Icons, Lists, Tables, Display, Position,
Overflow, Float, inline- block, Horizontal & Vertical Align, Combinators, Pseudo-classes, Pseudo-elements, Opacity
/ Transparency, Navigation Bar, Dropdowns, Image Gallery, Attribute Selectors, Forms, Counters, Website Layout, Units,
Specificity, Text Effects, Animations, Tooltip, Multiple Columns.
HTML:
 HTML stands for Hyper Text Markup Language.
 HTML was released in 1993 (27 years ago).
 HTML is the standard markup language for creating Web pages.
 HTML consists of a series of elements, which inform the browser how to
display the content .
 The latest version of HTML 5 was published in 2012. World Wide Web
Consortium (W3C) defines the specifications of HTML..
 HTML 5.2 was released on 27 May 2019 (13 months ago).
HTML Tag List:
HTML Table:
<table> element to define a table
<tr> element to define a table row
<td> element to define a table data
<th> element to define a table heading
<caption> element to define a table caption
border property to define a border
border-collapse property to collapse cell borders
text-align property to align cell text
border-spacing property to set the spacing between cells
Use the colspan attribute to make a cell span many columns
Use the rowspan attribute to make a cell span many rows
HTML Form:
TAG Definition
<form> Defines an HTML form for user input
<input> Defines an input control
<textarea> Defines a multiline input control (text area)
<label> Defines a label for an <input> element
<fieldset> Groups related elements in a form
<legend> Defines a caption for a <fieldset> element
<select> Defines a drop-down list
<optgroup> Defines a group of related options in a drop-down list
<option> Defines an option in a drop-down list
<button> Defines a clickable button
<datalist> Specifies a list of pre-defined options for input controls
HTML Character Entities & Formatting:
CSS:
 CSS stands for Cascaded Style Sheet.
 Wium Lie has proposed the concept of CSS in 1994 (26 years ago).
 The latest version of CSS 3 was published in 1999. World Wide Web
Consortium (W3C) defines the specifications of CSS.
 Father of HTML 5, CSS 3 => “Håkon Wium Lie”Håkon Wium Lie
CSS Syntax:
Types of CSS:
1) External CSS
2) Internal CSS
3) Inline CSS
External CSS:
 With an external style sheet, you can change the look of an entire website by
changing just one file.
 Each HTML page must include a reference to the external style sheet file inside
the <link> element, inside the head section.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
body {
background-color: lightblue;
}
h1 {
color: navy;
margin-left: 20px;
}
Internal CSS:
 An inline style may be used to apply a unique style for a single element.
 To use inline styles, add the style attribute to the relevant element. The
style attribute can contain any CSS property.
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color: linen;}
h1 {color: maroon;
margin-left: 40px; }
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Inline CSS:
 An inline style may be used to apply a unique style for a single element.
 To use inline styles, add the style attribute to the relevant element. The
style attribute can contain any CSS property.
<!DOCTYPE html>
<html>
<body>
<h1 style="color:blue;text-align:center;">
This is a heading
</h1>
<p style="color:red;">
This is a paragraph.
</p>
</body>
</html>
GATE Question:
1. Consider the HTML table definition given below:
<table border=1>
<tr>
<td rowspan=2>ab</td>
<td colspan=2> cd </td>
</tr>
<tr>
<td>ef</td>
<td rowspan=2>gh</td>
</tr>
<tr>
<td colspan=2>ik</td>
</tr>
</table>
The number of rows in each column and the number of columns in each row are
(a) 2, 2, 3 and 2, 3, 2 (b) 2, 2, 3 and 2, 2, 3
(c) 2, 3, 2 and 2, 3, 2 (d) 2, 3, 2 and 2, 2, 3
(GATE 2009: 1 Mark)
Model Questions:
2. The following HTML tag is used for inserting a line break?
(a) <br/> (b) <startbreak/>
(c) <lb/> (d) <LINEBRK/>
3. Which of the following is not a pair tag?
(a) <i> (b) <u>
(c) <b> (d) <br>
4. Which of the following HTML tag will provide the largest heading
(a) <h6> (b) <h1>
(c) <head8> (d) <heading6>
Model Questions: (Cont.)
5. Linking to another place in the same or another Web page require
two A (Anchor) tags, the first with the _______ attribute and the
second with the _______ attribute.
(a) NAME, LINK (b) LINK, HREF
(c) HREF, NAME (d) TARGET, VALUE
6. The facilities available in the Internet are
A. Electronic mail.
B. Remote login.
C. File transfer.
D. Encryption technique.
(a) A and B (b) A, B and D
(c) A, B and C (d) B, C and D
Home Work
HEADER
FOOTER
IMAGE VIDEO
Next Class:
HTML & CSS & JS

Weitere ähnliche Inhalte

Was ist angesagt? (20)

Document object model(dom)
Document object model(dom)Document object model(dom)
Document object model(dom)
 
Document Object Model
Document Object ModelDocument Object Model
Document Object Model
 
Dom
Dom Dom
Dom
 
Document Object Model
Document Object ModelDocument Object Model
Document Object Model
 
Dom structure
Dom structureDom structure
Dom structure
 
INTRODUCTION TO DOM AND DOM TREE
INTRODUCTION TO DOM AND DOM TREEINTRODUCTION TO DOM AND DOM TREE
INTRODUCTION TO DOM AND DOM TREE
 
Introduction to the DOM
Introduction to the DOMIntroduction to the DOM
Introduction to the DOM
 
Dom
DomDom
Dom
 
An Introduction to the DOM
An Introduction to the DOMAn Introduction to the DOM
An Introduction to the DOM
 
Web Information Systems XML
Web Information Systems XMLWeb Information Systems XML
Web Information Systems XML
 
Introduction to DOM
Introduction to DOMIntroduction to DOM
Introduction to DOM
 
Dom(document object model)
Dom(document object model)Dom(document object model)
Dom(document object model)
 
Internet and Web Technology (CLASS-14) [JSP] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-14) [JSP] | NIC/NIELIT Web Technology Internet and Web Technology (CLASS-14) [JSP] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-14) [JSP] | NIC/NIELIT Web Technology
 
Web Information Systems Html and css
Web Information Systems Html and cssWeb Information Systems Html and css
Web Information Systems Html and css
 
introduction to the document object model- Dom chapter5
introduction to the document object model- Dom chapter5introduction to the document object model- Dom chapter5
introduction to the document object model- Dom chapter5
 
DOM Quick Overview
DOM Quick OverviewDOM Quick Overview
DOM Quick Overview
 
Document Object Model
Document Object ModelDocument Object Model
Document Object Model
 
Web1O1 - Session 1
Web1O1 - Session 1Web1O1 - Session 1
Web1O1 - Session 1
 
Dhtml
DhtmlDhtml
Dhtml
 
The Document Object Model
The Document Object ModelThe Document Object Model
The Document Object Model
 

Ähnlich wie Internet and Web Technology (CLASS-3) [HTML & CSS]

Ähnlich wie Internet and Web Technology (CLASS-3) [HTML & CSS] (20)

web unit 2_4338494_2023_08_14_23_11.pptx
web unit 2_4338494_2023_08_14_23_11.pptxweb unit 2_4338494_2023_08_14_23_11.pptx
web unit 2_4338494_2023_08_14_23_11.pptx
 
HTML 4.0
HTML 4.0HTML 4.0
HTML 4.0
 
CSS Part I
CSS Part ICSS Part I
CSS Part I
 
HTML, CSS and XML
HTML, CSS and XMLHTML, CSS and XML
HTML, CSS and XML
 
HTML.pptx
HTML.pptxHTML.pptx
HTML.pptx
 
INTRODUCTION FOR HTML
INTRODUCTION  FOR HTML INTRODUCTION  FOR HTML
INTRODUCTION FOR HTML
 
Chapter 4a cascade style sheet css
Chapter 4a cascade style sheet cssChapter 4a cascade style sheet css
Chapter 4a cascade style sheet css
 
INTERNSHIP PROJECT PPT RAJ HZL.pdf
INTERNSHIP PROJECT PPT RAJ HZL.pdfINTERNSHIP PROJECT PPT RAJ HZL.pdf
INTERNSHIP PROJECT PPT RAJ HZL.pdf
 
HTML
HTMLHTML
HTML
 
CSS
CSSCSS
CSS
 
Html
HtmlHtml
Html
 
Html basics
Html basicsHtml basics
Html basics
 
CSS.pptx
CSS.pptxCSS.pptx
CSS.pptx
 
HTML & CSS Workshop Notes
HTML & CSS Workshop NotesHTML & CSS Workshop Notes
HTML & CSS Workshop Notes
 
HTML Tutorials
HTML TutorialsHTML Tutorials
HTML Tutorials
 
Unit 2
Unit 2 Unit 2
Unit 2
 
HTML - LinkedIn
HTML - LinkedInHTML - LinkedIn
HTML - LinkedIn
 
DIWE - Coding HTML for Basic Web Designing
DIWE - Coding HTML for Basic Web DesigningDIWE - Coding HTML for Basic Web Designing
DIWE - Coding HTML for Basic Web Designing
 
Intodcution to Html
Intodcution to HtmlIntodcution to Html
Intodcution to Html
 
HTML CSS.pdf
HTML CSS.pdfHTML CSS.pdf
HTML CSS.pdf
 

Mehr von Ayes Chinmay

Internet and Web Technology (CLASS-16) [Basic Elements of Java Program] | NIC...
Internet and Web Technology (CLASS-16) [Basic Elements of Java Program] | NIC...Internet and Web Technology (CLASS-16) [Basic Elements of Java Program] | NIC...
Internet and Web Technology (CLASS-16) [Basic Elements of Java Program] | NIC...Ayes Chinmay
 
Internet and Web Technology (CLASS-15) [JAVA Basics] | NIC/NIELIT Web Technol...
Internet and Web Technology (CLASS-15) [JAVA Basics] | NIC/NIELIT Web Technol...Internet and Web Technology (CLASS-15) [JAVA Basics] | NIC/NIELIT Web Technol...
Internet and Web Technology (CLASS-15) [JAVA Basics] | NIC/NIELIT Web Technol...Ayes Chinmay
 
Internet and Web Technology (CLASS-10) [Node.js] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-10) [Node.js] | NIC/NIELIT Web Technology Internet and Web Technology (CLASS-10) [Node.js] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-10) [Node.js] | NIC/NIELIT Web Technology Ayes Chinmay
 
Internet and Web Technology (CLASS-9) [React.js] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-9) [React.js] | NIC/NIELIT Web TechnologyInternet and Web Technology (CLASS-9) [React.js] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-9) [React.js] | NIC/NIELIT Web TechnologyAyes Chinmay
 
Internet and Web Technology (CLASS-4) [CSS & JS]
Internet and Web Technology (CLASS-4) [CSS & JS] Internet and Web Technology (CLASS-4) [CSS & JS]
Internet and Web Technology (CLASS-4) [CSS & JS] Ayes Chinmay
 
Internet and Web Technology (CLASS-1) [Introduction]
Internet and Web Technology (CLASS-1) [Introduction]Internet and Web Technology (CLASS-1) [Introduction]
Internet and Web Technology (CLASS-1) [Introduction]Ayes Chinmay
 

Mehr von Ayes Chinmay (6)

Internet and Web Technology (CLASS-16) [Basic Elements of Java Program] | NIC...
Internet and Web Technology (CLASS-16) [Basic Elements of Java Program] | NIC...Internet and Web Technology (CLASS-16) [Basic Elements of Java Program] | NIC...
Internet and Web Technology (CLASS-16) [Basic Elements of Java Program] | NIC...
 
Internet and Web Technology (CLASS-15) [JAVA Basics] | NIC/NIELIT Web Technol...
Internet and Web Technology (CLASS-15) [JAVA Basics] | NIC/NIELIT Web Technol...Internet and Web Technology (CLASS-15) [JAVA Basics] | NIC/NIELIT Web Technol...
Internet and Web Technology (CLASS-15) [JAVA Basics] | NIC/NIELIT Web Technol...
 
Internet and Web Technology (CLASS-10) [Node.js] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-10) [Node.js] | NIC/NIELIT Web Technology Internet and Web Technology (CLASS-10) [Node.js] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-10) [Node.js] | NIC/NIELIT Web Technology
 
Internet and Web Technology (CLASS-9) [React.js] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-9) [React.js] | NIC/NIELIT Web TechnologyInternet and Web Technology (CLASS-9) [React.js] | NIC/NIELIT Web Technology
Internet and Web Technology (CLASS-9) [React.js] | NIC/NIELIT Web Technology
 
Internet and Web Technology (CLASS-4) [CSS & JS]
Internet and Web Technology (CLASS-4) [CSS & JS] Internet and Web Technology (CLASS-4) [CSS & JS]
Internet and Web Technology (CLASS-4) [CSS & JS]
 
Internet and Web Technology (CLASS-1) [Introduction]
Internet and Web Technology (CLASS-1) [Introduction]Internet and Web Technology (CLASS-1) [Introduction]
Internet and Web Technology (CLASS-1) [Introduction]
 

Kürzlich hochgeladen

“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...Marc Dusseiller Dusjagr
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Educationpboyjonauth
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxNirmalaLoungPoorunde1
 
Separation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesSeparation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesFatimaKhan178732
 
Mastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory InspectionMastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory InspectionSafetyChain Software
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Sapana Sha
 
_Math 4-Q4 Week 5.pptx Steps in Collecting Data
_Math 4-Q4 Week 5.pptx Steps in Collecting Data_Math 4-Q4 Week 5.pptx Steps in Collecting Data
_Math 4-Q4 Week 5.pptx Steps in Collecting DataJhengPantaleon
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeThiyagu K
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactdawncurless
 
PSYCHIATRIC History collection FORMAT.pptx
PSYCHIATRIC   History collection FORMAT.pptxPSYCHIATRIC   History collection FORMAT.pptx
PSYCHIATRIC History collection FORMAT.pptxPoojaSen20
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfchloefrazer622
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991RKavithamani
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxiammrhaywood
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Krashi Coaching
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introductionMaksud Ahmed
 
Presiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha electionsPresiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha electionsanshu789521
 
CARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxCARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxGaneshChakor2
 
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Celine George
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptxVS Mahajan Coaching Centre
 

Kürzlich hochgeladen (20)

“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Education
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
 
Separation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesSeparation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and Actinides
 
Mastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory InspectionMastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory Inspection
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
 
_Math 4-Q4 Week 5.pptx Steps in Collecting Data
_Math 4-Q4 Week 5.pptx Steps in Collecting Data_Math 4-Q4 Week 5.pptx Steps in Collecting Data
_Math 4-Q4 Week 5.pptx Steps in Collecting Data
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
 
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
 
PSYCHIATRIC History collection FORMAT.pptx
PSYCHIATRIC   History collection FORMAT.pptxPSYCHIATRIC   History collection FORMAT.pptx
PSYCHIATRIC History collection FORMAT.pptx
 
Arihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdfArihant handbook biology for class 11 .pdf
Arihant handbook biology for class 11 .pdf
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introduction
 
Presiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha electionsPresiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha elections
 
CARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptxCARE OF CHILD IN INCUBATOR..........pptx
CARE OF CHILD IN INCUBATOR..........pptx
 
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
 

Internet and Web Technology (CLASS-3) [HTML & CSS]

  • 2. IWT Syllabus: Module 1: Web: Internet, Word Wide Web(WWW), History of the Internet, History of the Web, Protocols Governing the Web, Types of Websites, Web Applications, Web Projects, Web architecture, HTML, URI, HTTP, Issues in Web Development, Webserver, web browser, Internet standards, TCP/IP Protocol suite, MIME, Cyber Laws. Hyper Text Transfer Protocol(HTTP): Understand the need for HTTP, URL and it Anatomy, HTTP message format, Persistent and Non-persistent Connections, Web Caching, Proxy Web Page Designing HTML: Introduction to HTML, Mark up Language, HTML Tags, HTML Document Structure, HTML Comments, head, title, base, link, style, meta, script, Heading tags, paragraph, anchor, image, video, line breaks, text formatting, lists, frames, forms. Cascaded Style Sheet Inline Styles, Internal Style Sheet, External Style Sheet, Selectors, Colors, Backgrounds, Background Image, Background Attachment, Background Shorthand, Borders, Margins, Padding, Fonts, Links, Icons, Lists, Tables, Display, Position, Overflow, Float, inline- block, Horizontal &amp; Vertical Align, Combinators, Pseudo-classes, Pseudo-elements, Opacity / Transparency, Navigation Bar, Dropdowns, Image Gallery, Attribute Selectors, Forms, Counters, Website Layout, Units, Specificity, Text Effects, Animations, Tooltip, Multiple Columns.
  • 3. HTML:  HTML stands for Hyper Text Markup Language.  HTML was released in 1993 (27 years ago).  HTML is the standard markup language for creating Web pages.  HTML consists of a series of elements, which inform the browser how to display the content .  The latest version of HTML 5 was published in 2012. World Wide Web Consortium (W3C) defines the specifications of HTML..  HTML 5.2 was released on 27 May 2019 (13 months ago).
  • 5. HTML Table: <table> element to define a table <tr> element to define a table row <td> element to define a table data <th> element to define a table heading <caption> element to define a table caption border property to define a border border-collapse property to collapse cell borders text-align property to align cell text border-spacing property to set the spacing between cells Use the colspan attribute to make a cell span many columns Use the rowspan attribute to make a cell span many rows
  • 6. HTML Form: TAG Definition <form> Defines an HTML form for user input <input> Defines an input control <textarea> Defines a multiline input control (text area) <label> Defines a label for an <input> element <fieldset> Groups related elements in a form <legend> Defines a caption for a <fieldset> element <select> Defines a drop-down list <optgroup> Defines a group of related options in a drop-down list <option> Defines an option in a drop-down list <button> Defines a clickable button <datalist> Specifies a list of pre-defined options for input controls
  • 7. HTML Character Entities & Formatting:
  • 8. CSS:  CSS stands for Cascaded Style Sheet.  Wium Lie has proposed the concept of CSS in 1994 (26 years ago).  The latest version of CSS 3 was published in 1999. World Wide Web Consortium (W3C) defines the specifications of CSS.  Father of HTML 5, CSS 3 => “Håkon Wium Lie”Håkon Wium Lie
  • 10. Types of CSS: 1) External CSS 2) Internal CSS 3) Inline CSS
  • 11. External CSS:  With an external style sheet, you can change the look of an entire website by changing just one file.  Each HTML page must include a reference to the external style sheet file inside the <link> element, inside the head section. <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html> body { background-color: lightblue; } h1 { color: navy; margin-left: 20px; }
  • 12. Internal CSS:  An inline style may be used to apply a unique style for a single element.  To use inline styles, add the style attribute to the relevant element. The style attribute can contain any CSS property. <!DOCTYPE html> <html> <head> <style> body {background-color: linen;} h1 {color: maroon; margin-left: 40px; } </style> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> </html>
  • 13. Inline CSS:  An inline style may be used to apply a unique style for a single element.  To use inline styles, add the style attribute to the relevant element. The style attribute can contain any CSS property. <!DOCTYPE html> <html> <body> <h1 style="color:blue;text-align:center;"> This is a heading </h1> <p style="color:red;"> This is a paragraph. </p> </body> </html>
  • 14. GATE Question: 1. Consider the HTML table definition given below: <table border=1> <tr> <td rowspan=2>ab</td> <td colspan=2> cd </td> </tr> <tr> <td>ef</td> <td rowspan=2>gh</td> </tr> <tr> <td colspan=2>ik</td> </tr> </table> The number of rows in each column and the number of columns in each row are (a) 2, 2, 3 and 2, 3, 2 (b) 2, 2, 3 and 2, 2, 3 (c) 2, 3, 2 and 2, 3, 2 (d) 2, 3, 2 and 2, 2, 3 (GATE 2009: 1 Mark)
  • 15. Model Questions: 2. The following HTML tag is used for inserting a line break? (a) <br/> (b) <startbreak/> (c) <lb/> (d) <LINEBRK/> 3. Which of the following is not a pair tag? (a) <i> (b) <u> (c) <b> (d) <br> 4. Which of the following HTML tag will provide the largest heading (a) <h6> (b) <h1> (c) <head8> (d) <heading6>
  • 16. Model Questions: (Cont.) 5. Linking to another place in the same or another Web page require two A (Anchor) tags, the first with the _______ attribute and the second with the _______ attribute. (a) NAME, LINK (b) LINK, HREF (c) HREF, NAME (d) TARGET, VALUE 6. The facilities available in the Internet are A. Electronic mail. B. Remote login. C. File transfer. D. Encryption technique. (a) A and B (b) A, B and D (c) A, B and C (d) B, C and D
  • 18. Next Class: HTML & CSS & JS