Оцените презентацию от 1 до 5 баллов!
Тип файла:
ppt / pptx (powerpoint)
Всего слайдов:
18 слайдов
Для класса:
1,2,3,4,5,6,7,8,9,10,11
Размер файла:
257.50 kB
Просмотров:
58
Скачиваний:
0
Автор:
неизвестен
Слайды и текст к этой презентации:
№1 слайд![Computation and Problem](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img0.jpg)
Содержание слайда: Computation and Problem Solving
Introduction to the HTML
Korzhumbayev Azamat
№2 слайд![HTML Source Document When you](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img1.jpg)
Содержание слайда: HTML Source Document
When you connect to a web page by entering its URL into the browser
Browser instructs your computer to send a message out over the Internet to the computer specified by that URL requests that it sends back a certain document (HTML source doc)
HTML source doc describes the content and layout of the web page
After your computer receives the html, your browser interprets the html and displays the resulting web page (text/graphics/links etc)
№3 слайд![HTML Source Document HTML](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img2.jpg)
Содержание слайда: HTML Source Document
HTML source document
A text-only document
Consists of (1) actual text, and (2) tags
A tag is an html code that is enclosed in angel brackets <>; used to lay out the web page.
XHTML is a simple, more standardized version of HTML
XHTML/HTML can be created using a simple text editor like notepad
File extension must be .html or .htm
№4 слайд![Sample HTML](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img3.jpg)
Содержание слайда: Sample HTML
№5 слайд![HTML, XML, XHTML XML](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img4.jpg)
Содержание слайда: HTML, XML, XHTML
XML (eXtensible Markup Language):
is a set of rules that lets web designers classify their data in a way customized to their needs.
Extendable by creating new types of tags.
XHTML (eXtensible HyperText Markup Language):
A new version of HTML based on XML
Inherits strict syntax rules of XML
№6 слайд![HTML vs. XHTML Some](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img5.jpg)
Содержание слайда: HTML vs. XHTML
Some comparisons of HTML vs. XHTML
№7 слайд![Composition of a HTML](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img6.jpg)
Содержание слайда: Composition of a HTML Document
An HTML document consists of four main parts:
the DOCTYPE
the Html
the Head
the Body
№8 слайд![Composition of a HTML Document](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img7.jpg)
Содержание слайда: Composition of a HTML Document
№9 слайд![Creating HTML](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img8.jpg)
Содержание слайда: Creating HTML
№10 слайд![HTML Tags Elements Tags are](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img9.jpg)
Содержание слайда: HTML Tags/Elements
Tags are also called elements
An attribute is a special code that can enhance or modify a tag. They are generally located in the starting tag after the tag name.
Basic syntax for html tags and attr.
<tag attribute="value"> </tag>
All tags must be lower case and values of attributes need to be surrounded by quotes
№11 слайд![HTML Tags Elements Example lt](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img10.jpg)
Содержание слайда: HTML Tags/Elements
Example
<strong>This is bold text…</strong>
<p style =“text-align:center">This text will appear aligned to the center…</p>
№12 слайд![lt meta gt tag lt meta gt tag](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img11.jpg)
Содержание слайда: <meta> tag
<meta> tag
is used to specify keywords that describe a document’s contents as well as a short description.
Two necessary attributes – "name" & "content"
<meta name="keywords" content="baseball, soccer, tennis"/>
<meta name="description" content="Sports information page"/>
№13 слайд![lt p gt paragraph tag lt p gt](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img12.jpg)
Содержание слайда: <p> paragraph tag
<p> tag
The paragraph tag. Used so separate text within a web page.
Container type
Will provide line breaks
Optional attribute : align (not supported in HTML5)
<p align="center">
№14 слайд![lt br gt tag lt br gt tag Is](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img13.jpg)
Содержание слайда: <br/> tag
<br/> tag
Is used for line break
Example
<p>
Contact<br />
6150 Sennott Square<br />
University of Pittsburgh<br />
Pittsburgh, PA 15260
</p>
№15 слайд![Headings lt h gt to lt h gt](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img14.jpg)
Содержание слайда: Headings
<h1> to <h6>
Define headers. <h1> defines the largest header. <h6> defines the smallest header.
Example
<h1>This is header 1</h1>
<h2>This is header 2</h2>
<h3>This is header 3</h3>
<h4>This is header 4</h4>
<h5>This is header 5</h5>
<h6>This is header 6</h6>
№16 слайд![lt em gt amp lt strong gt](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img15.jpg)
Содержание слайда: <em> & <strong> tags
<em> tag
Renders text as emphasized text
<strong> tag
Renders text as strong emphasized text
Example (with smth. missing)
<em>Emphasized text</em><br />
<strong>Strong text</strong><br />
№17 слайд![Commenting Source Code](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img16.jpg)
Содержание слайда: Commenting Source Code
Comments are enclosed in <!-- and -->
Example
<!--This comment will not be displayed-->
<p>This is a regular paragraph</p>
What are the reasons for using comments?
№18 слайд![lt blockquote gt and lt q gt](/documents_5/83c3309eac20d491f380fa8a81aa06b7/img17.jpg)
Содержание слайда: <blockquote> and <q> tags
<blockquote> tag defines the start of a long quotation.
<blockquote cite= “http://www.forbes.kz/dollar.htm”> here is a long quotation here is …
</blockquote>
<q> tag defines the start of a long quotation.
<p><q cite=“if any”> here is a short quotation</q> that helps you </p>