Различия

Здесь показаны различия между двумя версиями данной страницы.

--- fullcircle:21:веб-разработка_ч2 [2010/04/03 09:40]
+++ fullcircle:21:веб-разработка_ч2 [2016/02/13 14:11] (текущий)
[HOW-TO: Веб-разработка. Часть 2]
@@ Строка 1: / Строка 1: @@
 ======HOW-TO: Веб-разработка. Часть 2 ======
-<style right>
-//Автор: Брэтт Альтон (Brett Alton)//
-</style>
   - [[..:20:веб-разработка_ч1|Веб-разработка. Часть 1]]
@@ Строка 9: / Строка 5: @@
   - [[..:22:веб-разработка_ч3|Веб-разработка. Часть 3]]
   - [[..:23:веб-разработка_ч4|Веб-разработка. Часть 4]]
+----
+<style right>
+//Автор: 4545 (Brett Alton)//
+</style>
 Причиной вашего выбора Ubuntu может быть всемирная экономическая рецессия или боязнь, что хакеры и вирусы удалят ваши данные, но в любом случае, вы не смогли бы ни читать эту статью, ни использовать Ubuntu, не существуй интернета.
@@ Строка 89: / Строка 91: @@
 Если не считать таблицы, то списки являются наверное самым сложным понятием для новичка. Используя <ul></ul> (маркированный список) мы можем отобразить содержимое тегов <li></li>, чтобы создать список. Используя <ol></ol> (упорядоченный список) вместо <ul></ul> мы получим цифры, а не маркеры. Списки также можно помещать в другие списки, добавив теги <ul></ul> или <ol></ol> внутрь <li></li>.
+<code html>
+<ul>
+<li>сижу на стуле</li>
+<li>
+смотрю фильмы
+<ul>
+<li>драму</li>
+<li>боевики</li>
+<li>другие</li>
+</ul>
+</li>
+<li>встаю, чтобы поесть</li>
+</ul>
+</code>
 В заключение скажу, что управлять дизайном страницы можно, поместив CSS (каскадные таблицы стилей) в HTML код.
-Сохраните код справа как "третий.html" на Рабочий стол.
+Сохраните следующий как "третий.html" на Рабочий стол.
+<code html>
+<html>
+<head>
+<title>Моё сочинительство</title>
+<style type="text/css">
+h1 {
+color: #ff0000;
+border-bottom: 5px solid #000000;
+text-align: center;
+}
+p {
+text-transform: uppercase;
+}
+</style>
+</head>
+<body>
+<h1>Моё сочинительство</h1>
+<p>
+Я смотрю телевизор очень <u><i> МНОГО</i></u>, вредно ли это?
+</p>
+<p>
+Я много занимаюсь этим:
+</p>
+<ul>
+<li>сижу на стуле</li>
+<li>смотрю фильмы</li>
+<li>встаю, чтобы поесть</li>
+</ul>
+<p>
+Вы ведёте здоровый образ жизни?
+</p>
+</body>
+</html>
+</code>
 Теперь дважды кликните на этом файле, чтобы открыть его в Firefox. Сейчас вы должны увидеть, что контент выводится по-другому.
@@ Строка 99: / Строка 149: @@
 Как вы заметили, синтаксис CSS отличается от HTML. Для определения элемента в нём используются скобки {}, а не тег <p></p>. В CSS это называется селектором и используется для выбора тега, который нужно изменить.
-В моём примере используются встроенные свойства CSS для модификации тегов <h1></h1> и <p></p>. Я - веб-профессионал, и всё равно не помню все свойства CSS и порой ищу в интернете, как их использовать. Поэтому не смущайтесь, если вам тоже приходится это делать. На самом деле многие сайты создали специальные "шпаргалки" для этих целей.
+В моём примере используются встроенные свойства CSS для модификации тегов <h1></h1> и <p></p>. Я - профессионал в веб-разработке, и всё равно не помню все свойства CSS и порой ищу в интернете, как их использовать. Поэтому не смущайтесь, если вам тоже приходится это делать. На самом деле многие сайты создали специальные "шпаргалки" для этих целей.
 Забавное число "#ff0000" - это цвет в шестнадцатеричном обозначении. При такой записи существует более 16 млн цветов. Поэтому используйте программы вроде Agave для создания цветовых схем.
@@ Строка 112: / Строка 162: @@
   - [[..:23:веб-разработка_ч4|Веб-разработка. Часть 4]]
-//[[..:20|К содержанию номера]]//
+----
+//[[..:21|К содержанию номера]]//
 //[[:fullcircle|К архиву журналов]]//
 </style>
-{{tag>Программирование Web-разработка Full_Circle}}
+{{tag>howto Программирование Web-разработка Full_Circle}}

HOW-TO: Веб-разработка. Часть 2 Сравнение версий

Различия