Здесь вы найдете много полезной информации о том как построить собственный сайт, как правильно верстать Web страницы, а также освоите множество приемов и трюков которые можно выполнить при помощи CSS, без использования Java-скриптов. Данный сайт будет полезен как новичку, так и опытному Web Мастеру.
В интернете каждый день появляются тысячи новых сайтов. И большинство из них напоминает клон того или другого успешного проекта. Причём клон не только внешний, но и внутренний. Так происходит по одной простой причине: начинающий сайтоваятель хочет быстро создать сайт. И знаете, как он мыслит? Примерно так: "Стоимость сайта должна быть равна нулю. Значит на дизайнеров и программеров тратиться излишне. Правильно, зачем создавать что-то уникальное, если всё уже до меня придумали. Вот популярный тематический сайт. Я сделаю также. Раз владелец этого сайта преуспел, значит и я тоже преуспею..." Поэтому дизайн сайтов, сделанных подобным образом, оставляет желать лушчего. Как изменить такое положение вещей? Просто нужно сделать нечто более уникальное. И первый шаг к уникальности в деле создания сайта - это создание шаблона сайта. Да-да. Вы не ослышались. Шаблон - это ключевой момент, когда Вам нужна разработка web сайтов, уникальных по своей природе. Именно шаблон и является тем фирменным стил
... Читать дальше »/div>
Языки оформления внешнего вида сайта - два поколения языка CSS (CSS:http://www.w3.org/TR/REC-CSS-1; CSS2:http://www.w3.org/TR/REC-Css2) - позволяют задать формат страницы, управлять шрифтами, расположением элементов, цветом и так далее.
В большинстве случаев CSS может занять место устаревшей табличной разметки на HTML. В любом из случаев с помощью CSS можно отказаться от использования тегов шрифта и другого устаревшего "мусора", только увеличивающего трафик вроде этого примера:
В самом начале обучения компьютерному программированию студенты узнают о принципе GIGO (Garbage In Garbage Out) "мусор на входе - мусор на выходе". Ведь языки вроде C и Java не просто поощряют правильную технику создания кода, они ее требуют.
Точно также начинающие графические дизайнеры узнают что качество конечного продукта зависит от качества исходных материалов. При грамотной работе готовая Web-графика (качественные фотографии с высоким разрешением) будет выглядеть отлично. Если попробовать создать дизайн с низкокачественным изображением, вряд ли результат получится сколько-либо привлекательным. Можно оптимизировать для Web изображение в формате EPS с высоким разрешением, но нельзя из низкокачественного файла GIF сделать что-либо приемлемое. Запомните: "мусор на входе - мусор на выходе".
Но традиционные браузеры работают по другому принципу. Они собирают воедино кривой код и неработающие ссылки и в большинстве случаев отображают сайты довольно приемлемо. Такое прослабление п
... Читать дальше »/div>
Мощная и удобная программа для веб разработчиков, с полным набором всех необходимых функций. С ней вам не придется печатать вручную все теги полностью, программа сама предлагает вам выбрать нужный тег из списка, а также атрибуты тегов. Значительно уменьшает ваше время на написание кода. Автоматически проверяет код на ошибки, и в случае их обнаружения - уведомляет о них. Также имеется функция поиска и замены кода как в отдельном документе, так и на всем сайте!
Русификатор в комплекте. Таблетка не требуется. Размер 60.5 MB.
Страницы сайта полностью состоят из различных тегов, имеющих разные свойства. Все теги в HTML обязательно должны быть заключены в угловые скобки, также для основной массы тегов обязательно должен быть закрывающий тег. Для примера возьмем самый главный тег, который указывает браузеру на начало HTML-документа HTML. Для этого тега обязательно должен быть закрывающий тег, который указывает на то, что документ закончен. Все остальные теги должны располагаться внутри этих тегов. Пример:
Code
<HTML><!-- Начало HTML документа (открывающий тег) --> <HEAD> <TITLE>Заголовок страницы</TITLE> ... Читать дальше »/div>
Представляем вам полный список HTML тегов с подробными описаниями и примерами. В дополнение таблица кодов ASCII, список свойств CSS, а также свойства DHTML в примерах. Все это находится в одном файле и абсолютно бесплатно.
Может определить величину полей внутри всего элемента или для каждой стороны в отдельности.
Свойства:
padding - определяет величину полей. Значения задаются любыми способами измерения принятыми в CSS. В одной строке можно указать 4 размера одновременно, они будут действовать для каждой стороны в последовательности: (верхний правый нижний левый). Также можно указать величину поля только для одной стороны. Примеры:
Code
padding: 10px; // Поле со всех сторон элемента 10 пикселей
Может определить величину отступа вокруг всего элемента или для каждой стороны в отдельности.
Свойства:
margin - определяет величину отступов. Значения задаются любыми способами измерения принятыми в CSS. В одной строке можно указать 4 размера одновременно, они будут действовать для каждой стороны в последовательности: (верхний правый нижний левый). Также можно указать величину отступа только для одной стороны. Примеры:
Code
margin: 10px; // Отступ от всех сторон элемента 10 пикселей
Дает возможность размещения элементов не по расположению их в коде, а конкретными координатами относительно родительского контейнера или всей страницы.
Свойства:
position - устанавливает откуда брать точки отсчета при позиционировании. Данный атрибут обязательно должен быть указан, иначе все нижеперечисленные в этой статье свойства не будут работать. Примеры:
Code
position: absolute; // Отсчет берется относительно всей страницы
Здесь описаны свойства, позволяющие установить ширину и высоту элемента, расположение элемента относительно родительского контейнера, запретить полное или частичное обтекание элемента другими или полностью скрыть его из вида.
Свойства:
width - определяет ширину элемента. Значение указывается всеми величинами, принятыми в CSS. Пример:
Code
width: 200px; // Ширина элемента 200 пикселей
Значение по умолчанию - auto
height - определяет высоту элемента. Значение указывается всеми величинами, принятыми в CS
... Читать дальше »/div>
С помощью этого параметра можно установить стиль, цвет и толщину рамок вокруг элемента, будь то изображение или отдельные блоки.
Свойства:
border-width - определяет ширину рамки. Значения устанавливаются в пикселях. Пример:
Code
border-width: 3px; // Ширина рамки 3 пикселя
В одной строке также можно установить ширину для всех четырех сторон рамки. Первый размер указывается для верхней стороны, потом по часовой стрелке. Пример:
Спомощью данного свойства можно установить множество различных атрибутов шрифта. Выбрать непосредственно сам шрифт, определить размер шрифта, стиль шрифта, жирность, также можно сделать заглавные буквы размером в строчные.
Свойства:
font-family - определяет тип шрифта. Можно одновременно указать несколько типов шрифта через запятую. По умолчанию берется первый шрифт который указан в строке, если у пользователя этот шрифт не установлен - браузер автоматически переходит на следующий шрифт, и т.д. Пример:
С текстом в CSS можно производить множество различных трансформаций. Устанавливать нужное расстояние между символами, высоту строки, выравнивание текста по всевозможным границам, делать его подчеркнутым, перечеркнутым или мигающим. Устанавливать величину отступа первой строки для абзаца, и в то же время последующие строки будут выввыводится без отступа, преобразовывать прописные буквы в заглавные, не меняя их высоты и т.д...
Свойства:
text-align - определяет выравнивание текста по горизонтали. Примеры:
Данное свойство определяет степень прозрачности элемента. Т.е. когда элементу присвоена частичная или полная прозрачность - сквозь него могут быть видны фон и другие элементы, перекрываемые данным элементом.
Свойства:
opacity - значения указываются числами от 0.0 до 1.0 Значение 0.0 определяет полную прозрачность элемента. Пример:
Code
opacity: 0.5; // прозрачность элемента ровно на половину
Является основным указателем фона как для отдельного блока, так и для всей страницы в целом. С его помощью можно указать цвет фона, фоновое изображение, также можно определить расположение фонового изображения в блоке, фиксировать его, или же позволить прокручиваться в месте с содержимым блока.
Свойства:
background-color - указывает цвет фона. Значение можно указывать шеснадцатеричным числом:
