Форум hotibo.ru

Сайты - по стандартам, но не стандартные сайты!






#1 01.02.2012 01:14

Rafis
Новичок
Зарегистрирован: 20.12.2011
Сообщений: 34

Мои маленькие советы по CSS

Мои маленькие советы CSS
Управляющий свет примерно так назову эту функцию, которое я пробовал делать на экспериментах
Вообще для создания сайтов  я применяю  Dreamweaver, привожу пример создания   вертикальных  и  горизонтальных линий, которая позволить вам выстраивать в одну линию разные элементы вашего дизайна.
Так как в Dreamweaver их нет, я придумал, как создать их,
используя, теги

и волшебную силу CSS.
Вообще выкладываю свой секрет для этого создаем в  Dreamweaver  два класса CSS, которые я назвал .horzGuide и .verGuide. Я обозначил обе направляющие ярко-зеленым цветом и установил их z-индекс в значение 100, чтобы выделить и поместить поверх всего остального на своей странице.
Решение  проблемы происходит, так как  горизонтальная направляющая состоит в том, чтобы установить свойство верхней границы в 1 пиксел, а ширину на 100%,  привожу код как я делал.

.horzGuide {
border-top: 1px  solid #00ff00
position: absolute;
left:100px;
top:0px;
width:100%;
z-index:100;
}

Я также назначил начало направляющей в самой левой точке экрана.
Вертикальные направляющие задал  похожим образом, но с двумя измененными ключевыми качествами. Дальше чтоб  прочертить вертикальную направляющую, я установил левую границу вместо верхней границы в случае горизонтального гида и задал высоту 100% вместо ширины.

примерно так

.vertGuide   {
border-left:   lpx  solid #00FF00;
position: absolute;
left:Opx;
top:10Opx;
height-.100%;
z-index:100;
}

После создал  тег
, выбирал  в меню Insert (Вставка раздела Layout (Компоновка) команду Insert
Tag (Вставить тег Div). Дальше  на экране  появится  диалоговое окно тега
, выбрал из списка (Класс) пункт horzGuide или vertGuide - и  вот мы уже готовы к применению своих замашек.

Дополнительная  подсказка - отмените выбор View > Visual Ai Layer Borders (Вид > Служебная разметка > Границы фреймов), чтобы вид просто линии, если направляющие не выделены.

Дальше, после того как
появится на странице, мы  можем двигать его множеством способов. Так как  это перемещаемый
(то есть слой, говоря  в терминах Dreamweaver), по этому  мы можем перетащить его, туда куда хочу и все.
Совет  теги
вы можете перемещать  с помощью клавиш навигации с шагом в 1 пиксел или с нажатой клавишей Shift с шагом в 10 пикселов.
Для точного расположения в пикселях  смело изменяйте поля Left (Слева) или Тор (Верх) в инспекторе  Property Inspector (Инспектор свойств).

дальше смотрим, что  правила CSS  мы установили  как classes, чем как ID,   теперь мы  можем создать столько вертикальных и горизонтальных линий, сколько нам душе угодно.
Совет: Сохраняйте ваш CSS в виде прикрепляемых каскадных стилей и используйте функцию Design Time Style Sheet (Стили периода разработки), чтобы подключить CSS всякий раз, когда вы захотите иметь эти функции направляющих

Если у вас будут вопросы как сделать все по CSS  задавайте  их , я  постараюсь   ответь на них  даже если нет  решения  проблем, мы  будем искать выход , мне самому интересно экспериментировать и применять на практике  то что получится ,только прошу не задавайте вопросы по табличному дизайну я их просто не навожу,  для тех  кто хорошо может работать с графикой я могу  организовать нормальный сайт для реализации ваших творений , условие: Вы    создаете   или рисуете хорошую шапку , но только чтоб она была приемлема для CSS, под резиновую верстку  , и применялась как фоновый рисунок , а зачем это нужно,  для того чтоб можно было одним кликом поменять рисунок на всех сотнях страниц , наверное  вы знаете, что богат не тот, кто дорого продает, а тот чем его услуги пользуются.
Можете подавать уменьшенные картинки.
Дизайн  должен быть серьезным вот и все.
Рафис Анверович
megakamsk.net.ru

Отредактированно Rafis (01.02.2012 02:12)

Нет на форуме

 

#2 01.02.2012 01:49

h4
Новичок
Зарегистрирован: 29.01.2012
Сообщений: 37

Re: Мои маленькие советы по CSS

Какой-то ужасающий бред. В DW есть нормальные направляющие, это раз.

left:Opx;

С каких это пор буква "O" стала применима для указания размерности?

Нет на форуме

 

#3 01.02.2012 02:16

Rafis
Новичок
Зарегистрирован: 20.12.2011
Сообщений: 34

Re: Мои маленькие советы по CSS

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

Отредактированно Rafis (01.02.2012 02:18)

Нет на форуме

 

#4 01.02.2012 02:47

h4
Новичок
Зарегистрирован: 29.01.2012
Сообщений: 37

Re: Мои маленькие советы по CSS

В Dreamweaver: слева и сверху есть линейки. От них драг-н-дропом вытягиваются направляющие. В любом количестве.

В FireFox. Устанавливаем Web developer toolbar. Выбираем "Miscelation" > "Display Line Guides".

И никакого изврата.

Нет на форуме

 

#5 01.02.2012 02:56

Rafis
Новичок
Зарегистрирован: 20.12.2011
Сообщений: 34

Re: Мои маленькие советы по CSS

Спасибо за важную информацию .Видите мы с вами помогли решить важную проблему для других
приглашаю вас на открытый стол по поводу советов  как на это смотрите

Нет на форуме

 

Board footer