🗊Презентация HTML+CSS. HTML basics, semantics and main elements. (Module 2)

Нажмите для полного просмотра!
HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №1HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №2HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №3HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №4HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №5HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №6HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №7HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №8HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №9HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №10HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №11HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №12HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №13HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №14HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №15HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №16HTML+CSS. HTML basics, semantics and main elements. (Module 2), слайд №17

Вы можете ознакомиться и скачать презентацию на тему HTML+CSS. HTML basics, semantics and main elements. (Module 2). Доклад-сообщение содержит 17 слайдов. Презентации для любого класса можно скачать бесплатно. Если материал и наш сайт презентаций Mypresentation Вам понравились – поделитесь им с друзьями с помощью социальных кнопок и добавьте в закладки в своем браузере.

Слайды и текст этой презентации


Слайд 1





HTML+CSS course
Module 2. HTML basics: semantics and main elements
Описание слайда:
HTML+CSS course Module 2. HTML basics: semantics and main elements

Слайд 2





HTML basics : Agenda
Semantics
Main elements and their attributes
Div, span
Lists
Links
Images
Описание слайда:
HTML basics : Agenda Semantics Main elements and their attributes Div, span Lists Links Images

Слайд 3





Semantic HTML code
Not semantic code
<font size=“7"><b>This is a heading</b></font>
Semantic code:
<h1>This is a heading</h1>
Описание слайда:
Semantic HTML code Not semantic code <font size=“7"><b>This is a heading</b></font> Semantic code: <h1>This is a heading</h1>

Слайд 4





More reasons to use semantic HTML
It can be shorter and so downloads faster.
It makes site updates easier.
It is easier for people and especially machines to understand.
It gives possibility to change the look without affecting HTML.
It separates work on design and content.
Описание слайда:
More reasons to use semantic HTML It can be shorter and so downloads faster. It makes site updates easier. It is easier for people and especially machines to understand. It gives possibility to change the look without affecting HTML. It separates work on design and content.

Слайд 5





Block and Inline Elements
Описание слайда:
Block and Inline Elements

Слайд 6





Block Elements
Описание слайда:
Block Elements

Слайд 7





Inline Elements
Описание слайда:
Inline Elements

Слайд 8





Divisions and spans
Описание слайда:
Divisions and spans

Слайд 9





Classes and Identifiers
Описание слайда:
Classes and Identifiers

Слайд 10





Inline elements: em or i,  strong or b?
Описание слайда:
Inline elements: em or i, strong or b?

Слайд 11





Inline elements: em or i,  strong or b?
Описание слайда:
Inline elements: em or i, strong or b?

Слайд 12





Small CSS spoiler for better explanation
Описание слайда:
Small CSS spoiler for better explanation

Слайд 13





Image element
<img src="URL" alt="alternative text"> 

The <img> tag defines an image in an HTML page 
Required attributes: src and alt
Optional attributes: width and height
Описание слайда:
Image element <img src="URL" alt="alternative text"> The <img> tag defines an image in an HTML page Required attributes: src and alt Optional attributes: width and height

Слайд 14





Hyperlink element
<a href=“page.html">Go to page</a>
The <a> tag provides a hyperlink somewhere.
Required attribute: href
Optional attributes: type, target, title, rel
Описание слайда:
Hyperlink element <a href=“page.html">Go to page</a> The <a> tag provides a hyperlink somewhere. Required attribute: href Optional attributes: type, target, title, rel

Слайд 15





Hyperlink element
<a href=“page.html“ type=“html” target=“_blank” title=“Some link” rel=“nofollow”>
		Go to page
</a>
Описание слайда:
Hyperlink element <a href=“page.html“ type=“html” target=“_blank” title=“Some link” rel=“nofollow”> Go to page </a>

Слайд 16





List element
<ul> 
	<li>Element 1</li>
	<li>Element 2</li>
</ul>
Описание слайда:
List element <ul> <li>Element 1</li> <li>Element 2</li> </ul>

Слайд 17





Headings and paragraphs
<h1>Biggest</h1> <h2>Smaller</h2>
<h3>Smaller</h3> <h4>Smaller</h4>
<h5>Smaller</h5> <h6>Smaller</h6>
<p>Long text with lorem ipsumdolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
Описание слайда:
Headings and paragraphs <h1>Biggest</h1> <h2>Smaller</h2> <h3>Smaller</h3> <h4>Smaller</h4> <h5>Smaller</h5> <h6>Smaller</h6> <p>Long text with lorem ipsumdolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>



Похожие презентации
Mypresentation.ru
Загрузить презентацию