SlideShare a Scribd company logo
1 of 10
Html guts This presentation, will teach basic Html code  B Dubuque
The main parts of an Html page All Html commands are in brackets  eg <COMMAND> When a command ends a slash appears in the brackets eg </COMMAND> All Html pages usually contain the following commands in the following sequence. <HTML> begins the page. <HEAD> defines parameters by which the page is set. <TITLE> the TITLE of your page that is displayed in your browser header. The TITLE command goes within the HEAD command. </TITLE> ends (or closes) your title command. </HEAD> ends (or closes) your HEAD command <BODY> begins the content area </BODY> ends (or closes) the content area </HTML> ends (or closes) the page B Dubuque
Index.html ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],B Dubuque
Body, body who’s got the  BODY ? As I said, the Index page is the first page of your standard Internet website.  Yet it does not always have body (or content) on it. Many times for various, or perhaps even devious reasons there is no content on the Index page. One such reason may be to hide the content code from prying eyes, but perhaps a better reason is the code itself. The Index page is often used to setup, and layout the design and function of the rest of the pages of the website. If a page has what is called FRAMES, the index page is used to set the FRAME pages up, and the BODY (content) is then displayed by pages that load after it. In such a case the FRAME pages are usually divided so that a navigation Menu can be displayed in the same browser window, as the content. Eg.  <FRAMESET rows=&quot;150,*&quot;> <FRAME SRC=&quot;header.html&quot; NAME=header> <FRAME SRC=“main.html&quot;  NAME=main> </FRAMESET> B Dubuque
BODY  of  evidence Within the BODY of an HTML page, the content of the page is formatted with  a number of different commands. In addition to the commands within the BODY The BODY command usually has a string of commands within it’s statement. Eg.. <BODY BGCOLOR=&quot;000000&quot; TEXT=&quot;FFFFFF&quot; LINK=&quot;FFFFF0&quot; VLINK=&quot;800080&quot; ALINK=&quot;FF0000&quot;> The code above sets the default background color, text color, link color, Visited link color, and active link color. The colors in HTML code are always a group of six alphanumeric characters. In other codes such as JAVA You may see something different. If you have a wallpaper background, this also is listed in the BODY command statement. B Dubuque
More on the  BODY The following is a list of commands commonly found within the BODY or content of a page. <P ALIGN=&quot;left&quot;> aligns the paragraph left  <P ALIGN=&quot;justify&quot;> justifies the paragraph <P ALIGN=&quot;center&quot;> centers the paragraph <P ALIGN=&quot;right&quot;> aligns the paragraph right In all the above commands  </P> ends (or closes) the paragraph. <BR>  creates a linebreak in  the format.  Often used for spacing objects or text on the page. <HR> creates a line on your page. There are additional commands for this statement that set the width, thickness, bold, or shadow. B Dubuque
Changing  fonts Fonts can be changed within the BODY using the FONT command as follows. <FONT SIZE=“+2&quot; COLOR=“FF0000&quot; FACE=&quot;Arial, Helvetica&quot;><STRONG><EM> - Your text goes here - </EM></STRONG></FONT> The above example changes the size, color, type face, and adds bold along With italics to the font. Any text is within the setting and ending statements. The text would look something like this.. -Your text goes here - When a type face is used, in many instances more than one type face is listed in order for the effect to be compatible in all browsers. B Dubuque
Adding graphics Graphics are added by using the IMG SRC command as follows.. <IMG SRC=“graphic.jpg&quot;> You can manipulate the size, placement, add a border, or no border of the graphic on the page by adding additional commands to the statement. Eg.. <IMG WIDTH=&quot;150&quot; HEIGHT=&quot;120&quot; SRC=“graphic.jpg&quot; BORDER=&quot;1&quot; ALIGN=&quot;left&quot; HSPACE=&quot;150&quot; VSPACE=&quot;120&quot;> B Dubuque
RAW   code.. <HTML><head><title>Our Earth</title></head> <body bgcolor=&quot;FFFFFF&quot; text=&quot;000000&quot; link=&quot;FFFFF0&quot; vlink=&quot;800080&quot; alink=&quot;FF0000&quot;&quot;> <IMG SRC=&quot;world.gif&quot; WIDTH=&quot;120&quot; HEIGHT=&quot;137&quot; BORDER=&quot;0&quot; ALIGN=&quot;left&quot; HSPACE=&quot;10&quot; VSPACE=&quot;10&quot;> <BR><BR><HR WIDTH=400><CENTER> <FONT SIZE=&quot;+2&quot; COLOR=&quot;0000FF&quot; FACE=&quot;Arial, Helvetica&quot;><STRONG><EM>- OUR EARTH -</EM></STRONG></FONT></CENTER><HR WIDTH=400> <BR><P>Our Earth is a mighty fine place to live. We have our problems like any other planet. Yet I can't imagine any place more hospitable than this. Out of all the planets in our galaxy, there is none as fine as the one we call home.</P><P ALIGN=&quot;center&quot;>B Dubuque</P></BODY></HTML> B Dubuque
- OUR EARTH - Our Earth is a mighty fine place to live. We have our problems like any other planet. Yet I can't imagine any place more hospitable than this. Out of all the planets in our galaxy, there is none as fine as the one we call home. B Dubuque B Dubuque

More Related Content

What's hot

Block2 Session2 Presentation
Block2 Session2 PresentationBlock2 Session2 Presentation
Block2 Session2 PresentationMichael Gwyther
 
Fundamentals Of Html
Fundamentals Of HtmlFundamentals Of Html
Fundamentals Of HtmlJLENA mOORE
 
Intro to HTML (Kid's Class at TIY)
Intro to HTML (Kid's Class at TIY)Intro to HTML (Kid's Class at TIY)
Intro to HTML (Kid's Class at TIY)Marjorie Sample
 
The Basics of (X)HTML Tags
The Basics of (X)HTML TagsThe Basics of (X)HTML Tags
The Basics of (X)HTML TagsLearningNerd
 
HTML presentation for beginners
HTML presentation for beginnersHTML presentation for beginners
HTML presentation for beginnersjeroenvdmeer
 
Eye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easilyEye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easilyshabab shihan
 
6.1 special characters
6.1 special characters6.1 special characters
6.1 special charactersBulldogs83
 
YL basic tag
YL basic tagYL basic tag
YL basic tagdilom1986
 
Xhtml Css Presentation
Xhtml Css PresentationXhtml Css Presentation
Xhtml Css Presentationjoshpuckett
 
Web design in 7 days by waqar
Web design in 7 days by waqarWeb design in 7 days by waqar
Web design in 7 days by waqarWaqar Chodhry
 
Hyper Text Marup Language
Hyper Text Marup LanguageHyper Text Marup Language
Hyper Text Marup LanguageAniketPujari
 
YL Intro html
YL Intro htmlYL Intro html
YL Intro htmldilom1986
 
Flex For Flash Developers Ff 2006 Final
Flex For Flash Developers Ff 2006 FinalFlex For Flash Developers Ff 2006 Final
Flex For Flash Developers Ff 2006 Finalematrix
 
Google Sites Web Page Creation
Google Sites Web Page CreationGoogle Sites Web Page Creation
Google Sites Web Page CreationBrian Stumbaugh
 
Lecture 6 - Comm Lab: Web @ ITP
Lecture 6 - Comm Lab: Web @ ITPLecture 6 - Comm Lab: Web @ ITP
Lecture 6 - Comm Lab: Web @ ITPyucefmerhi
 

What's hot (19)

Block2 Session2 Presentation
Block2 Session2 PresentationBlock2 Session2 Presentation
Block2 Session2 Presentation
 
Fundamentals Of Html
Fundamentals Of HtmlFundamentals Of Html
Fundamentals Of Html
 
Intro to HTML (Kid's Class at TIY)
Intro to HTML (Kid's Class at TIY)Intro to HTML (Kid's Class at TIY)
Intro to HTML (Kid's Class at TIY)
 
The Basics of (X)HTML Tags
The Basics of (X)HTML TagsThe Basics of (X)HTML Tags
The Basics of (X)HTML Tags
 
HTML presentation for beginners
HTML presentation for beginnersHTML presentation for beginners
HTML presentation for beginners
 
Eye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easilyEye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easily
 
6.1 special characters
6.1 special characters6.1 special characters
6.1 special characters
 
YL basic tag
YL basic tagYL basic tag
YL basic tag
 
belajar HTML
belajar HTML belajar HTML
belajar HTML
 
Xhtml Css Presentation
Xhtml Css PresentationXhtml Css Presentation
Xhtml Css Presentation
 
Web design in 7 days by waqar
Web design in 7 days by waqarWeb design in 7 days by waqar
Web design in 7 days by waqar
 
Hyper Text Marup Language
Hyper Text Marup LanguageHyper Text Marup Language
Hyper Text Marup Language
 
XHTML basics
XHTML basicsXHTML basics
XHTML basics
 
YL Intro html
YL Intro htmlYL Intro html
YL Intro html
 
Flex For Flash Developers Ff 2006 Final
Flex For Flash Developers Ff 2006 FinalFlex For Flash Developers Ff 2006 Final
Flex For Flash Developers Ff 2006 Final
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Google Sites Web Page Creation
Google Sites Web Page CreationGoogle Sites Web Page Creation
Google Sites Web Page Creation
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
 
Lecture 6 - Comm Lab: Web @ ITP
Lecture 6 - Comm Lab: Web @ ITPLecture 6 - Comm Lab: Web @ ITP
Lecture 6 - Comm Lab: Web @ ITP
 

Viewers also liked

Importance Of Quality Financial Information
Importance Of Quality Financial InformationImportance Of Quality Financial Information
Importance Of Quality Financial InformationGeorge Delaney FCA
 
Early Warning Systems
Early Warning SystemsEarly Warning Systems
Early Warning Systemskaakaawaah
 
Presentazione di prova
Presentazione di provaPresentazione di prova
Presentazione di provagloi
 
Resoluciòn de una EDO en MATHLAB
Resoluciòn de una EDO en MATHLABResoluciòn de una EDO en MATHLAB
Resoluciòn de una EDO en MATHLABIrag1989
 
Садовый измельчитель веток Bosch AXT 25 D
Садовый измельчитель веток Bosch AXT 25 DСадовый измельчитель веток Bosch AXT 25 D
Садовый измельчитель веток Bosch AXT 25 DAl Maks
 
Young Investor Times - Summer 2006
Young Investor Times - Summer 2006Young Investor Times - Summer 2006
Young Investor Times - Summer 2006wise1199
 
Informe producto
Informe productoInforme producto
Informe productokode99
 
Hepatitis C virus infection and type 2 diabetes mellitus in Mexican patients.
Hepatitis C virus infection and type 2 diabetes mellitus in Mexican patients. Hepatitis C virus infection and type 2 diabetes mellitus in Mexican patients.
Hepatitis C virus infection and type 2 diabetes mellitus in Mexican patients. Erwin Chiquete, MD, PhD
 
Benefits of Working with Registered Investment Advisor
Benefits of Working with Registered Investment AdvisorBenefits of Working with Registered Investment Advisor
Benefits of Working with Registered Investment Advisorhalasconsult
 
Cerebral Venous Thrombosis in a Mexican Multicenter Registry of Acute Cerebro...
Cerebral Venous Thrombosis in a Mexican Multicenter Registry of Acute Cerebro...Cerebral Venous Thrombosis in a Mexican Multicenter Registry of Acute Cerebro...
Cerebral Venous Thrombosis in a Mexican Multicenter Registry of Acute Cerebro...Erwin Chiquete, MD, PhD
 
Exporting grades to powerschool
Exporting grades to powerschoolExporting grades to powerschool
Exporting grades to powerschoolMaryAnn Medved
 

Viewers also liked (20)

Importance Of Quality Financial Information
Importance Of Quality Financial InformationImportance Of Quality Financial Information
Importance Of Quality Financial Information
 
Early Warning Systems
Early Warning SystemsEarly Warning Systems
Early Warning Systems
 
Presentazione di prova
Presentazione di provaPresentazione di prova
Presentazione di prova
 
Resoluciòn de una EDO en MATHLAB
Resoluciòn de una EDO en MATHLABResoluciòn de una EDO en MATHLAB
Resoluciòn de una EDO en MATHLAB
 
Monografia1
Monografia1Monografia1
Monografia1
 
Садовый измельчитель веток Bosch AXT 25 D
Садовый измельчитель веток Bosch AXT 25 DСадовый измельчитель веток Bosch AXT 25 D
Садовый измельчитель веток Bosch AXT 25 D
 
Industrial Jeopardy
Industrial JeopardyIndustrial Jeopardy
Industrial Jeopardy
 
Young Investor Times - Summer 2006
Young Investor Times - Summer 2006Young Investor Times - Summer 2006
Young Investor Times - Summer 2006
 
Informe producto
Informe productoInforme producto
Informe producto
 
Proteções coletivas
Proteções coletivasProteções coletivas
Proteções coletivas
 
Bibliografía Egizu
Bibliografía EgizuBibliografía Egizu
Bibliografía Egizu
 
Hepatitis C virus infection and type 2 diabetes mellitus in Mexican patients.
Hepatitis C virus infection and type 2 diabetes mellitus in Mexican patients. Hepatitis C virus infection and type 2 diabetes mellitus in Mexican patients.
Hepatitis C virus infection and type 2 diabetes mellitus in Mexican patients.
 
Benefits of Working with Registered Investment Advisor
Benefits of Working with Registered Investment AdvisorBenefits of Working with Registered Investment Advisor
Benefits of Working with Registered Investment Advisor
 
Cerebral Venous Thrombosis in a Mexican Multicenter Registry of Acute Cerebro...
Cerebral Venous Thrombosis in a Mexican Multicenter Registry of Acute Cerebro...Cerebral Venous Thrombosis in a Mexican Multicenter Registry of Acute Cerebro...
Cerebral Venous Thrombosis in a Mexican Multicenter Registry of Acute Cerebro...
 
Presentazione primaria 2014
Presentazione primaria 2014Presentazione primaria 2014
Presentazione primaria 2014
 
Exporting grades to powerschool
Exporting grades to powerschoolExporting grades to powerschool
Exporting grades to powerschool
 
Texturas y Matices
Texturas y MaticesTexturas y Matices
Texturas y Matices
 
Mbc teacher layout
Mbc teacher layoutMbc teacher layout
Mbc teacher layout
 
Mbc student layout
Mbc student layoutMbc student layout
Mbc student layout
 
GERMANY
GERMANYGERMANY
GERMANY
 

Similar to Html in a box

Similar to Html in a box (20)

introduction to web technology
introduction to web technologyintroduction to web technology
introduction to web technology
 
HTML
HTMLHTML
HTML
 
Web designing using html
Web designing using htmlWeb designing using html
Web designing using html
 
Html
HtmlHtml
Html
 
CSS
CSSCSS
CSS
 
Master pages ppt
Master pages pptMaster pages ppt
Master pages ppt
 
How To Create Personal Web Pages On My Web
How To Create Personal Web Pages On My WebHow To Create Personal Web Pages On My Web
How To Create Personal Web Pages On My Web
 
Cheat codes
Cheat codesCheat codes
Cheat codes
 
Introduction To Lamp
Introduction To LampIntroduction To Lamp
Introduction To Lamp
 
EPiServer Web Parts
EPiServer Web PartsEPiServer Web Parts
EPiServer Web Parts
 
Creating a Webpage
Creating a WebpageCreating a Webpage
Creating a Webpage
 
HTML Advanced
HTML AdvancedHTML Advanced
HTML Advanced
 
WordPress Development Confoo 2010
WordPress Development Confoo 2010WordPress Development Confoo 2010
WordPress Development Confoo 2010
 
Css
CssCss
Css
 
KMUTNB - Internet Programming 3/7
KMUTNB - Internet Programming 3/7KMUTNB - Internet Programming 3/7
KMUTNB - Internet Programming 3/7
 
Meta tags1
Meta tags1Meta tags1
Meta tags1
 
Module 2 Lesson 1
Module 2 Lesson 1Module 2 Lesson 1
Module 2 Lesson 1
 
Understanding THML
Understanding THMLUnderstanding THML
Understanding THML
 
Visualforce css developer guide(by forcetree.com)
Visualforce css developer guide(by forcetree.com)Visualforce css developer guide(by forcetree.com)
Visualforce css developer guide(by forcetree.com)
 
HTML_Slideshow1
HTML_Slideshow1HTML_Slideshow1
HTML_Slideshow1
 

Recently uploaded

THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATIONTHEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATIONHumphrey A Beña
 
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...JhezDiaz1
 
Judging the Relevance and worth of ideas part 2.pptx
Judging the Relevance  and worth of ideas part 2.pptxJudging the Relevance  and worth of ideas part 2.pptx
Judging the Relevance and worth of ideas part 2.pptxSherlyMaeNeri
 
Science 7 Quarter 4 Module 2: Natural Resources.pptx
Science 7 Quarter 4 Module 2: Natural Resources.pptxScience 7 Quarter 4 Module 2: Natural Resources.pptx
Science 7 Quarter 4 Module 2: Natural Resources.pptxMaryGraceBautista27
 
Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designMIPLM
 
Q4 English4 Week3 PPT Melcnmg-based.pptx
Q4 English4 Week3 PPT Melcnmg-based.pptxQ4 English4 Week3 PPT Melcnmg-based.pptx
Q4 English4 Week3 PPT Melcnmg-based.pptxnelietumpap1
 
Gas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxGas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxDr.Ibrahim Hassaan
 
Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Celine George
 
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)lakshayb543
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxiammrhaywood
 
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...Nguyen Thanh Tu Collection
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parentsnavabharathschool99
 
Karra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxKarra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxAshokKarra1
 
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYKayeClaireEstoconing
 
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Celine George
 
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfLike-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfMr Bounab Samir
 
Earth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatEarth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatYousafMalik24
 
Barangay Council for the Protection of Children (BCPC) Orientation.pptx
Barangay Council for the Protection of Children (BCPC) Orientation.pptxBarangay Council for the Protection of Children (BCPC) Orientation.pptx
Barangay Council for the Protection of Children (BCPC) Orientation.pptxCarlos105
 
DATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersDATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersSabitha Banu
 

Recently uploaded (20)

THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATIONTHEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
THEORIES OF ORGANIZATION-PUBLIC ADMINISTRATION
 
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
 
Judging the Relevance and worth of ideas part 2.pptx
Judging the Relevance  and worth of ideas part 2.pptxJudging the Relevance  and worth of ideas part 2.pptx
Judging the Relevance and worth of ideas part 2.pptx
 
Science 7 Quarter 4 Module 2: Natural Resources.pptx
Science 7 Quarter 4 Module 2: Natural Resources.pptxScience 7 Quarter 4 Module 2: Natural Resources.pptx
Science 7 Quarter 4 Module 2: Natural Resources.pptx
 
Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-design
 
Q4 English4 Week3 PPT Melcnmg-based.pptx
Q4 English4 Week3 PPT Melcnmg-based.pptxQ4 English4 Week3 PPT Melcnmg-based.pptx
Q4 English4 Week3 PPT Melcnmg-based.pptx
 
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptxFINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
 
Gas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxGas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptx
 
Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17
 
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
 
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parents
 
Karra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxKarra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptx
 
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
 
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
 
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfLike-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
 
Earth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatEarth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice great
 
Barangay Council for the Protection of Children (BCPC) Orientation.pptx
Barangay Council for the Protection of Children (BCPC) Orientation.pptxBarangay Council for the Protection of Children (BCPC) Orientation.pptx
Barangay Council for the Protection of Children (BCPC) Orientation.pptx
 
DATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersDATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginners
 

Html in a box

  • 1. Html guts This presentation, will teach basic Html code B Dubuque
  • 2. The main parts of an Html page All Html commands are in brackets eg <COMMAND> When a command ends a slash appears in the brackets eg </COMMAND> All Html pages usually contain the following commands in the following sequence. <HTML> begins the page. <HEAD> defines parameters by which the page is set. <TITLE> the TITLE of your page that is displayed in your browser header. The TITLE command goes within the HEAD command. </TITLE> ends (or closes) your title command. </HEAD> ends (or closes) your HEAD command <BODY> begins the content area </BODY> ends (or closes) the content area </HTML> ends (or closes) the page B Dubuque
  • 3.
  • 4. Body, body who’s got the BODY ? As I said, the Index page is the first page of your standard Internet website. Yet it does not always have body (or content) on it. Many times for various, or perhaps even devious reasons there is no content on the Index page. One such reason may be to hide the content code from prying eyes, but perhaps a better reason is the code itself. The Index page is often used to setup, and layout the design and function of the rest of the pages of the website. If a page has what is called FRAMES, the index page is used to set the FRAME pages up, and the BODY (content) is then displayed by pages that load after it. In such a case the FRAME pages are usually divided so that a navigation Menu can be displayed in the same browser window, as the content. Eg. <FRAMESET rows=&quot;150,*&quot;> <FRAME SRC=&quot;header.html&quot; NAME=header> <FRAME SRC=“main.html&quot; NAME=main> </FRAMESET> B Dubuque
  • 5. BODY of evidence Within the BODY of an HTML page, the content of the page is formatted with a number of different commands. In addition to the commands within the BODY The BODY command usually has a string of commands within it’s statement. Eg.. <BODY BGCOLOR=&quot;000000&quot; TEXT=&quot;FFFFFF&quot; LINK=&quot;FFFFF0&quot; VLINK=&quot;800080&quot; ALINK=&quot;FF0000&quot;> The code above sets the default background color, text color, link color, Visited link color, and active link color. The colors in HTML code are always a group of six alphanumeric characters. In other codes such as JAVA You may see something different. If you have a wallpaper background, this also is listed in the BODY command statement. B Dubuque
  • 6. More on the BODY The following is a list of commands commonly found within the BODY or content of a page. <P ALIGN=&quot;left&quot;> aligns the paragraph left <P ALIGN=&quot;justify&quot;> justifies the paragraph <P ALIGN=&quot;center&quot;> centers the paragraph <P ALIGN=&quot;right&quot;> aligns the paragraph right In all the above commands </P> ends (or closes) the paragraph. <BR> creates a linebreak in the format. Often used for spacing objects or text on the page. <HR> creates a line on your page. There are additional commands for this statement that set the width, thickness, bold, or shadow. B Dubuque
  • 7. Changing fonts Fonts can be changed within the BODY using the FONT command as follows. <FONT SIZE=“+2&quot; COLOR=“FF0000&quot; FACE=&quot;Arial, Helvetica&quot;><STRONG><EM> - Your text goes here - </EM></STRONG></FONT> The above example changes the size, color, type face, and adds bold along With italics to the font. Any text is within the setting and ending statements. The text would look something like this.. -Your text goes here - When a type face is used, in many instances more than one type face is listed in order for the effect to be compatible in all browsers. B Dubuque
  • 8. Adding graphics Graphics are added by using the IMG SRC command as follows.. <IMG SRC=“graphic.jpg&quot;> You can manipulate the size, placement, add a border, or no border of the graphic on the page by adding additional commands to the statement. Eg.. <IMG WIDTH=&quot;150&quot; HEIGHT=&quot;120&quot; SRC=“graphic.jpg&quot; BORDER=&quot;1&quot; ALIGN=&quot;left&quot; HSPACE=&quot;150&quot; VSPACE=&quot;120&quot;> B Dubuque
  • 9. RAW code.. <HTML><head><title>Our Earth</title></head> <body bgcolor=&quot;FFFFFF&quot; text=&quot;000000&quot; link=&quot;FFFFF0&quot; vlink=&quot;800080&quot; alink=&quot;FF0000&quot;&quot;> <IMG SRC=&quot;world.gif&quot; WIDTH=&quot;120&quot; HEIGHT=&quot;137&quot; BORDER=&quot;0&quot; ALIGN=&quot;left&quot; HSPACE=&quot;10&quot; VSPACE=&quot;10&quot;> <BR><BR><HR WIDTH=400><CENTER> <FONT SIZE=&quot;+2&quot; COLOR=&quot;0000FF&quot; FACE=&quot;Arial, Helvetica&quot;><STRONG><EM>- OUR EARTH -</EM></STRONG></FONT></CENTER><HR WIDTH=400> <BR><P>Our Earth is a mighty fine place to live. We have our problems like any other planet. Yet I can't imagine any place more hospitable than this. Out of all the planets in our galaxy, there is none as fine as the one we call home.</P><P ALIGN=&quot;center&quot;>B Dubuque</P></BODY></HTML> B Dubuque
  • 10. - OUR EARTH - Our Earth is a mighty fine place to live. We have our problems like any other planet. Yet I can't imagine any place more hospitable than this. Out of all the planets in our galaxy, there is none as fine as the one we call home. B Dubuque B Dubuque

Editor's Notes

  1. It is not necessary to capitalize HTML commands, it is however considered NETiquette, and makes troubleshooting easier.
  2. Tweaking the Meta description, and the Meta keywords is often the difference between a successful website, and an unsuccessful one.
  3. The above FRAMESET command opens a browser window and divides the window top and bottom. Two html pages header.html and main.html will have the BODY (content) portion of the page on it. Remember, this being the index page the META commands will also be on it.
  4. An example of what the previous code might look like. Thanx for watching..