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

Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentInMediaRes1
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactdawncurless
 
Concept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfConcept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfUmakantAnnand
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdfSoniaTolstoy
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAssociation for Project Management
 
Hybridoma Technology ( Production , Purification , and Application )
Hybridoma Technology  ( Production , Purification , and Application  ) Hybridoma Technology  ( Production , Purification , and Application  )
Hybridoma Technology ( Production , Purification , and Application ) Sakshi Ghasle
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxOH TEIK BIN
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introductionMaksud Ahmed
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxiammrhaywood
 
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppURLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppCeline George
 
Separation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesSeparation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesFatimaKhan178732
 
“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
 
The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13Steve Thomason
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...EduSkills OECD
 
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
 
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityGeoBlogs
 
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
 

Recently uploaded (20)

Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media Component
 
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impactAccessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
 
Concept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfConcept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.Compdf
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across Sectors
 
Hybridoma Technology ( Production , Purification , and Application )
Hybridoma Technology  ( Production , Purification , and Application  ) Hybridoma Technology  ( Production , Purification , and Application  )
Hybridoma Technology ( Production , Purification , and Application )
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introduction
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
 
URLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website AppURLs and Routing in the Odoo 17 Website App
URLs and Routing in the Odoo 17 Website App
 
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdfTataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
 
Separation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and ActinidesSeparation of Lanthanides/ Lanthanides and Actinides
Separation of Lanthanides/ Lanthanides and Actinides
 
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
 
“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...
 
The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
 
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
 
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activity
 
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
 
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🔝
 

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..