All Articles Dreamweaver
Изучение CSS в Dreamweaver Учебник Часть 1: Новые параметры элементов HTML
Geoff Blake on Tue, February 8th | 0 comments
Learning how to work with CSS is absolutely critical to building contemporary websites. It's one of those things that we, as designers, have to hunker down and learn at some point. And even after you

Обучение работе с CSS абсолютно решающее значение для создания современных веб-сайтов. Это одна из тех вещей, которые мы, как проектировщики, должны сидеть на корточках и узнать, в какой-то точке. И даже если вы мастер основы, есть еще куда расти и расширяться. Вы можете узнать о новых свойствах или как добиться конкретных результатов, и вы можете обнаружить методы для поддержания вашего CSS, как мясо-н означают насколько это возможно.

In this tutorial post, we'll be taking a look at the fundamentals of working with CSS in Dreamweaver. You'll learn about two primary rule types, how to create them, and how to begin applying them throughout your site.

Понимание того, как стили работы

Во-первых, я должен спросить вас, вы знаете о стилях в некоторых других ваших приложений? InDesign имеет стили, Illustrator имеет стили ... черт, даже Microsoft Word имеет стилей. Стиль это просто набор параметров форматирования. Например, мы могли бы стиль под названием "Акцент", и в течение Акцент мы установили шрифт, размер и цвет. На данный момент, мы можем начать применять Акцент на протяжении всей нашей документ, и, конечно, где когда-либо мы используем его, мы получим тот же шрифт, размер и цвет используется. Если бы мы вернуться и внести изменения в оригинальном стиле Акцент, то форматирование будет обновляться мгновенно, где бы он был использован в наш документ.

Это, как стили традиционно работают. Однако, CSS развивает эту идею еще дальше. Вместо работы со стилями в пределах только одной страницы, с CSS вы можете применить ваши набор правил для группы страниц - или ко всем страницам вашего сайта. Редактировать одну из ваших правил, и это изменение будет рябь весь сайт так быстро, как вы можете выбрать "Файл

Вот это сила!

Несколько других точках быстрого прежде чем двигаться дальше. Во-первых, термин «стиль» и термин «правило» используются как синонимы в Dreamweaver и CSS. Иногда Dreamweaver будем использовать термин "стиль", а в остальное время он будет использовать "правило". Многие новые пользователи путаются в этом и предположим, Dreamweaver, говорим о двух разных вещах. Это не так! Стили и правила одно и то же.

Во-вторых, список правил называется стилей. Таблицы стилей могут быть расположены в пределах конкретной страницы HTML (это называется внутренней таблицы стилей) или сохранены в отдельном файле, за пределами ваших страницах (так называемые внешние таблицы стилей). Есть много интересных вещей можно сделать с помощью таблицы стилей, и мы поговорим о них более подробно в Dreamweaver CS5 101: Core Dreamweaver CS5 .

Теперь, когда мы понимаем, как стиль работы и есть смысл того, что таблицы стилей все о, мы должны обсудить два основных типа стилей CSS мы можем работать с: переопределены HTML элементов и правил класса. Каждый является очень мощным, и имеет конкретных целей. Давайте смотреть.

Look At Redefined элементов HTML

Обратимся переопределены HTML-элементов в первую очередь. Это мой любимый тип стиля, потому что они делают, это принять обычная, скучная HTML и перетащите его из каменного века в 21-м веке с помощью нескольких строк кода. И к счастью для нас, Dreamweaver, будет делать всю тяжелую работу, поэтому, если мы не хотим, мы не должны видеть никакого кода.

С переопределены HTML-элементов, мы будем принимать обычная, скучная HTML-элементов и размещение их под контролем CSS. Например, мы могли контролировать таблицы, изображения, заголовки, параграфы, и почти все остальное, что может показаться на вашей странице. Что важно помнить, что, когда мы заново HTML элемент, мы контроля всех вхождений данного элемента. Например, если вы создаете правило CSS, который переопределяет

, then all
elements on your page are now under the control of your CSS rule. If your redefined
rule resides in an external style sheet, then all tables across your entire site are now all controlled by a single CSS rule.

Как удивительный, как есть, оно не может быть, что вы хотите. Что делать, если вы только хотели управлять одним столом и оставить другим, как они были? Вот где класс правила вступают в игру. Мы войдем в тех, кто чуть-чуть. А сейчас давайте попробуем создать быструю переопределены HTML-тегов.

Вот как можно создать Redefined HTML тегов:

Шаг 1

В нижней части панели стилей CSS, щелкните Создать правило CSS значок.

Шаг 2

В новое правило CSS появившемся диалоговом окне выберите тег (Переопределяет элемента HTML) от выбора типа падение вниз меню.

Шаг 3

В Selector поле Имя, введите имя HTML-элемент, который вы хотите контролировать.

При вводе имени элемента, не забудьте оставить в угловых скобках. Другими словами, если вы хотите контролировать "

," you'd simply type in "table."

Вместо того, чтобы вводить имя элемента, вы можете выбрать его из выпадающего меню на правой стороне Selector поле Имя.

Шаг 4

В раскрывающемся меню Правила определения в нижней части диалогового окна выбрать, если вы хотите, чтобы сохранить новые правила внутренней таблицы стилей (этот документ только) или внешней таблицы стилей (Новый файл таблицы стилей). Или, если у вас уже есть внешние таблицы стилей придает вашей страницы, вы можете сохранить его там, выбрав его имя.

Нажмите OK.

Шаг 5

In the CSS Rule Definition dialog box that appears, begin applying the CSS formatting that you'd like to use for your new rule.


For example, if you're redefining a table, you may want to apply a background color, a font, margin settings, and so on. As you're working, click Apply in the CSS Rule Definition dialog box to preview your page. Any elements on your page that you've redefined using CSS will update.

Шаг 6

Когда вы закончите, нажмите кнопку ОК.

Когда вы закончите создание вашего переопределены HTML элемент, все вхождения HTML элемент на странице теперь несут форматирования, которые вы установили в определении CSS диалоговом окне Правила. Там нет необходимости, чтобы применить форматирование к чему-либо, потому что вы переопределения то, что уже используется. Не только это, но вы должны вернуться назад и вставить этот HTML-элемента на странице в определенный момент в будущем, он также будет под контролем вашего CSS. Это очень мощный и очень эффективный способ работы.

Хотя это всего лишь краткое введение в работу с переопределены HTML элементы, мы надеемся, вы поймете, почему они такие важные части панели инструментов веб-дизайнера. Они довольно легко работать, тоже. Просто возиться вокруг немного с ними в Dreamweaver в течение 10-20 минут, и я уверен, что вы будете до скорости с ними.

Теперь, я хотел продолжить наш взгляд на CSS в Dreamweaver, и это обсуждение двух основных типов правил, так что вместе со мной в части 2, где мы будем смотреть на работу с правилами класса. До встречи!

Не могу дождаться Часть 2? Вам не придется! Проверьте этот учебник Dreamweaver в то же время, с более продвинутые учебники скоро!

Comments (0)

You must be logged in to comment. Login Now

Feedback
Course Advisor
Don't Know Where To Start?
Ask A Course Advisor
Ask Us!
Copy the link below and paste it into an email, forum, or Facebook to share this with your friends.
Make money when you share our links
Become a macProVideo.com Affiliate!
The current affiliate rate is: 50%
Classes Start Next Week!
Live 8-week Online Certification Classes for: