-Цитатник

Легендарная бузина - (2)

Легендарная бузина У нас во дворе растет это дерево - бузина. Сейчас цветет и украшает двор. Я сф...

Выводим из организма яды и все лишнее - (0)

Выводим из организма яды и все лишнее Если вы хотите похудеть или просто оздоровиться, этот по...

Всё просто: если он действительно любит, то никогда не уйдёт. - (0)

Всё просто: если он действительно любит, то никогда не уйдёт. Уйти – это тоже решение, и...

Рецепт, если болит печень. - (0)

Рецепт, если болит печень Если вас беспокоит печень, вы живете в неблагоприятных экологических...

Потрясающие тканевые жалюзи своими руками - (1)

Потрясающие тканевые жалюзи своими руками Римские шторы часто называют «тканевыми ж...

 -Рубрики

 -Фотоальбом

Посмотреть все фотографии серии Общая
Общая
14:25 01.11.2013
Фотографий: 5

 -Приложения

  • Перейти к приложению Я - фотограф Я - фотографПлагин для публикации фотографий в дневнике пользователя. Минимальные системные требования: Internet Explorer 6, Fire Fox 1.5, Opera 9.5, Safari 3.1.1 со включенным JavaScript. Возможно это будет рабо
  • Перейти к приложению Всегда под рукой Всегда под рукойаналогов нет ^_^ Позволяет вставить в профиль панель с произвольным Html-кодом. Можно разместить там банеры, счетчики и прочее
  • Перейти к приложению Открытки ОткрыткиПерерожденный каталог открыток на все случаи жизни
  • Перейти к приложению Кнопки рейтинга «Яндекс.блоги» Кнопки рейтинга «Яндекс.блоги»Добавляет кнопки рейтинга яндекса в профиль. Плюс еще скоро появятся графики изменения рейтинга за месяц
  • Перейти к приложению Укорачиватель ссылок Укорачиватель ссылокУкорачиватель ссылок от сервиса Link.ac Наверняка вы задумывались - как сократить ссылку? Как поделиться с друзьями короткой ссылкой, чтобы им не пришлось все перепечатывать? Используя Link.ac вам

 -Всегда под рукой

 -Я - фотограф

Рона маленькая 2месяца и 5 месяцев

 -Поиск по дневнику

Поиск сообщений в Милаграс

 -Подписка по e-mail

 

 -Интересы

вязание.кулинария.бисероплетение.религия.юмор.быто

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 14.12.2012
Записей: 8638
Комментариев: 1459
Написано: 17664


УРОК 6--учимся делать рамочки

Суббота, 21 Февраля 2015 г. 22:57 + в цитатник
Цитата сообщения Православная_жизнь Урок № 6 Учимся делать рамочки

 А сейчас поучимся делать рамку с прокруткой,это довольно сложно,поэтому начнем с самой простой рамки в этом случае. Вот с такой:  

 

ВАШ ТЕКСТ

 

 

 За основу взял самую постую рамочку с картинкой: 

 

 (375x398, 184Kb)
ВАШ ТЕКСТ

А это рамочка прокрутки которую мы будем вставлять в нашу рамочку:

 


ВАШ ТЕКСТ

 

сейчас мы разберем ее на части и посмотрим,что за что отвечает:

1.   Здесь задаем расположение нашей рамки по центру:

 

 

2.  Это есть начало нашей прокрутки(то есть задвается сама таблица и дальше пойдут теги ее оформления):

 

3. Это задает режим прокрутки:

 

4.здесь мы задаем цвет треугольничков прокрутки:

вот эти треугольнички

 

  

5.здесь задается цвет бортика и его размер(по порядку):

6.  Здесь задаем размеры нашей прокрутки (первый размер это ширина,ее лучше задавать в %, и она сама растянется по нашей основной рамочке;второй размер это ее высота, ее задаем так как нам удобно):

 

7.   Эта команда задает цвет нашего фона (можно задавать числовым кодом, как для текста):

 

8. Следующая команда применяется,  если мы хотим ставить фоном картинку. В этом случае предыдущая команда просто полностью удаляется, а вместо обведенного URL , ставим адрес картинки без ковычек (что такое адрес картинки было описано в прошлых уроках(принцип смены фона таблицы):

 

Теперь после того как все разобрали,  вводим получившейся код в нашу рамочку, сразу после картинки,  вот так (розовым подчеркнул адрес картинки,а красным код нашей прокрутки и его отмену, то что не подчеркнуто внутри нашей прокрутки - это теги нашего текста, их мы тоже разберали на предыдущих уроках):

 

 

В принципе все,  если что не понятно пишите, дополню урок.  

Я пользуюсь вот этой подсказкой,  здесь много разных тег,  которыми можно дополнить нашу рамочку прокрутки:

Можно менять цвет прокрутки:

scrollbar-face-color - это цвет передней стороны панели прокрутки

scrollbar-track-color - это цвет полосы, по которой "ходит" панель прокрутки.

scrollbar-arrow-color - это цвет треугольника на верхнем и нижнем квадратах.

scrollbar-shadow-color - это цвет нижней и правой граней панели прокрутки.

scrollbar-darkshadow-color - это цвет тени от панели прокрутки.

scrollbar-highlight-color - это цвет верхней и левой граней панели прокрутки

scrollbar-3dlight-color - это цвет отсвета.

#FFFFFF - это коды цвета, которые можно менять. *******

Внешний отвечает за фон, рамку и размер:

свойство border определяет вид границы - стиль, цвет и ширину;

- свойство background-color определяет цвет фона, который вы видите, пока подгружается фоновая картинка

background-image (или в случае, если у вас отключена подкачка картинок);

- свойства width и height определяют соответственно ширину и высоту слоя, измеряются в пикселях.

Можно также и в процентах (от размера окна). *******

Внутренний div отвечает за стиль шрифта и прокрутку.

Даже если текста много, можно запихнуть его в маленькое окошко:

- свойство border определяет вид границы - стиль, цвет и ширину;

- свойство background-image определяет очередную фоновую картинку; - свойство overflow регулирует реакцию браузера, если реальные размеры блока не соответствуют заданным и может возникнуть его переполнение.

 

Серия сообщений "Рамочки и уроки по их созданию":
Часть 1 - Мы осень носим
Часть 2 - Урок № 1 Учимся делать рамочки
...
Часть 6 - Учимся делать простую рамочку
Часть 7 - Урок №5 Учимся делать рамочки
Часть 8 - Урок № 6 Учимся делать рамочки
Часть 9 - Как расположить несколько элементов на страничке рядом друг с другом.Урок для начинающих!
Часть 10 - Рамка для текста
...
Часть 13 - УРОКИ -окошки для текста и кнопки
Часть 14 - Рамочка для видео
Часть 15 - Рамочка для видео
Рубрики:  РАМОЧКИ/уроки
Метки:  

 

Добавить комментарий:
Текст комментария: смайлики

Проверка орфографии: (найти ошибки)

Прикрепить картинку:

 Переводить URL в ссылку
 Подписаться на комментарии
 Подписать картинку