• Страница 1 из 1
  • 1
Форум » Уроки html » Уроки html для новичков » HTML 5 и CSS 3
HTML 5 и CSS 3
ReactorДата: Четверг, 09.01.2014, 13:00 | Сообщение # 1
Статус: Offline
Лейтенант
Сообщений: 48
Награды «0»
-
+
«1»

Всем привет, в этому уроке я научу вас HTML 5 и CSS 3.

Если вы хорошо освоились с блочной версткой, то Вы сможете понять этот урок.
Итак, начнем.

Для начала создаем 2 текстовых документа:
index.html
style.css

Создали? Отлично!

В HTML 5 нам сразу бросается тег <!DOCTYPE>
в html 5 его упростили, теперь не нужно вводить длинный текст, как было раньше.
"<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">"

теперь нужно писать так:
<!DOCTYPE html> 
и браузер поймет, что вы используете HTML 5

Прежде всего исчезли некоторые элементы представления. Если они встречаются в вашем коде, избавьтесь от них!
Замените их семантически правильными элементами и придайте им нужный вид средствами CSS:
  • basefont;
  • big;
  • center;
  • font;
  • s;
  • strike;
  • tt;
  • u.


Некоторые их этих тегов встречаются относительно редко, но теги font и center присутствуют во многих страницах, для работы с которыми используются визуальные редакторы вроде Dreamweaver.

Еще некоторые элементы исчезают из-за появления более совершенных заменителей:
  • acronym заменяется на abbr;
  • applet заменяется на object;
  • dir заменяется на ul.


Кроме устаревших элементов, недействительными стали многие атрибуты. К их числу относятся следующие атрибуты представления:
  • align;
  • атрибуты link, vlink, alink и text тега body;
  • bgcolor;
  • height и width;
  • атрибут scrolling элемента iframe;
  • valign;
  • hspace и vspace;
  • атрибуты cellpadding, cellspacing и border тега table.


Существует одно серьезное "Заболевание", которому подвержены многие веб-разработчики нашего времени. Вокруг нас бушует эпидемия дивита - хронического синдрома, который заставляет людей упаковывать элементы в лишние теги div с идентификаторами banner, sidebar, article, footer и т.д.
Заболевание в высшей степени заразное. Разработчики быстро подхватывают дивит друг от друга, а так как лишние теги div не видны невооруженным глазом, легкие случаи дивита могут оставаться назамеченными годами.
Типичные проявление дивита выглядит так:
Код
<div id="navbar_wrapper">
     <div id="navbar">
        <ul>
            <li><a href="/">Главная</a></li>
            <li><a href="/">Главная</a></li>
        </ul>
     </div>
</div>

Теперь перейдем непосредственно к самому html 5.

Все начинается с правильной директивы doctype


Код
<!DOCTYPE html>
<html lang="RU">
     <head>
         <meta charset=utf-8>
         <title>Наша первая верстка на HTML 5 и CSS3</title>
     </head>

     <body>
     </body>
</html>

Ну, мы написали начало нашего документа.
Теперь давайте напишем наш заголовок.


Код
<header id="page_header">
     <h1>HTML 5 and CSS3</h1>
</header>
Продолжение следует...
Извиняйте, для написании этого урока, уходит много времени. smile
«Пред. тема | След. тема»
Форум » Уроки html » Уроки html для новичков » HTML 5 и CSS 3
  • Страница 1 из 1
  • 1
Поиск:
Понравилась тема? Расскажи друзьям...