http://edufuture.biz/index.php?action=history&feed=atom&title=%D0%9F%D1%80%D0%B0%D0%BA%D1%82%D0%B8%D1%87%D0%B5%D1%81%D0%BA%D0%B0%D1%8F_%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D0%B0_%E2%84%96_21%3A_%D0%A0%D0%B0%D0%BC%D0%BA%D0%B8_%D0%B8_%D1%80%D0%B0%D0%B7%D0%BC%D0%B5%D1%80%D1%8BПрактическая работа № 21: Рамки и размеры - История изменений2026-04-25T14:23:47ZИстория изменений этой страницы в викиMediaWiki 1.16.0http://edufuture.biz/index.php?title=%D0%9F%D1%80%D0%B0%D0%BA%D1%82%D0%B8%D1%87%D0%B5%D1%81%D0%BA%D0%B0%D1%8F_%D1%80%D0%B0%D0%B1%D0%BE%D1%82%D0%B0_%E2%84%96_21:_%D0%A0%D0%B0%D0%BC%D0%BA%D0%B8_%D0%B8_%D1%80%D0%B0%D0%B7%D0%BC%D0%B5%D1%80%D1%8B&diff=168618&oldid=prevUser16: Новая страница: «<metakeywords>Гіпермаркет Знань - перший в світі!, Гіпермаркет Знань, Інформатика 11 клас, клас, ур...»2012-03-05T21:18:44Z<p>Новая страница: «<metakeywords>Гіпермаркет Знань - перший в світі!, Гіпермаркет Знань, Інформатика 11 клас, клас, ур...»</p>
<p><b>Новая страница</b></p><div><metakeywords>Гіпермаркет Знань - перший в світі!, Гіпермаркет Знань, Інформатика 11 клас, клас, урок, на Тему, Структура веб-сайтів, різновиди веб-сайтів, Рамки, размеры,текста, шрифта, font, Практикуми, лабораторні, кейси</metakeywords> <br />
<br />
'''[[Гіпермаркет Знань - перший в світі!|Гіпермаркет Знань]]&gt;&gt;[[Інформатика|Інформатика]]&gt;&gt;[[Інформатика 11 клас|Інформатика 11 клас]]&gt;&gt; Інформатика: Структура веб-сайтів, різновиди веб-сайтів''' <br />
<br />
Практична робота до предмету '''[[Інформатика 11 клас|Інформатика 11 клас]]'''. <br />
<br />
Тема '''«[[Структура веб-сайтів, різновиди веб-сайтів|Практическая работа № 21: Рамки и размеры]]»'''. <br />
<br />
<br> <br>Розгляд теми: Структура веб-сайтів, різновиди веб-сайтів<br> <br />
<br />
'''<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Практическая работа № 21: Рамки и размеры'''<br>&nbsp;<br>1. Пустые области вокруг элементов Вэб-страницы<br>2. Рамки<br>3. Поля<br>4. Обтекание текстом<br>5. Задание размеров <br><br>Для того, чтобы было легче понять о чем будет идти речь, можно представить, что каждый элемент Вэб-страницы заключен в невидимую прямоугольную область и окружен:<br>- полосами чистого пространства,<br>- рамкой,<br>- полями.<br />
<br />
<br>'''&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Пустые области вокруг элементов Вэб-страницы'''<br />
<br />
<br>Для задания пустых областей вокруг любого элемента служит свойство padding.<br />
<br />
В качестве значений размера областей чистого пространства можно задавать величины, выраженные в пунктах, пикселях, миллиметрах, сантиметрах, дюймах, пиках, а также единицах ex, em. При задании размера при помощи единиц ex, функцию единицы измерения выполняет высота строчной буквы "x" текущего шрифта. em - позволяет указать размер относительно высоты шрифта в целом.<br />
<br />
Свойство padding задает размеры области, отделяющее содержимое от рамки.<br />
<br />
Свойства padding-left, padding-right, padding-top, padding-bottom позволяют отдельно задавать размеры соответствующих полос чистого пространства вокруг элемента.<br />
<br />
<br />
<br />
'''&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Рамки'''<br />
<br />
<br>Свойство border позволяет облечь в рамку любой элемент Вэб-страницы.<br />
<br />
Для задания толщины border-width рамки применяются константы thin(тонкая), medium(средняя), thick(толстая). В качестве значений размера можно задавать величины, выраженные в пунктах, пикселях, миллиметрах, сантиметрах, дюймах, пиках, а также единицах ex, em. При задании размера при помощи единиц ex, функцию единицы измерения выполняет высота строчной буквы "x" текущего шрифта. em - позволяет указать размер относительно высоты шрифта в целом.<br />
<br />
Задавая параметры рамки, надо определить стиль ее представления border-style - solid, double, groove, ridge, inset, outset, dotted, dashed.<br>Цвет рамки border-color может задаваться посредством наименования (red, yellow), шестнадцатеричным значением (#FF00AA), функцией RGB (25%,50%,0%), выражающей абсолютное или процентное содержание красной, зеленой и синей составляющих цвета.<br />
<br />
Все вышеуказанные свойства можно детализировать для верхней (top), нижней (bottom), левой (left), правой (right) частей рамки.<br>Т.е.:<br />
<br />
border-top, border-right, border-left, border-bottom.<br />
<br />
<br>'''&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Поля'''<br />
<br />
<br>Свойства margin-top, margin-bottom, margin-left, margin-right позволяют задавать размеры соответствующего поля для элемента Вэб-страницы.<br />
<br />
Поля дают возможность увеличивать размеры пустых областей, окружающих элемент. Поля (в отличие от пустых областей) расположены вне рамки, окружающей элемент.<br />
<br />
В качестве значений размера полей можно задавать величины, выраженные в пунктах, пикселях, миллиметрах, сантиметрах, дюймах, пиках, а также единицах ex, em. При задании размера при помощи единиц ex, функцию единицы измерения выполняет высота строчной буквы "x" текущего шрифта. em - позволяет указать размер относительно высоты шрифта в целом.<br />
<br />
Задание отрицательной величины поля приводит к его сужению.<br />
<br />
'''<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Обтекание текстом'''<br />
<br />
<br>Свойство float позволяет задать параметр обтекания текстом для любого элемента Вэб-страницы. Это свойство допускает два значения - left, right. Первое значение заставляет браузер помещать элемент слева от текста, а второе - справа. Свойство float нельзя применить по отношению к элементам страницы, размещенными средствами абсолютного позиционирования.<br />
<br />
Свойство clear со значениями left, right, both позволяет отменить действие механизма обтекания элементов страницы текстом. Так значение left указывает, что текст не должен уступать место элементам, определенным посредством стиля float:left. Функция both отменяет обтекание во всех случаях.<br />
<br />
<br>'''&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Задание размеров'''<br />
<br />
<br>Для задания высоты и ширины размеров любого элемента Вэб-страницы служат свойства height, width.<br />
<br />
В качестве значений высоты и ширины можно задавать величины, выраженные в пунктах, пикселях, миллиметрах, сантиметрах, дюймах, пиках, а также единицах ex, em. При задании размера при помощи единиц ex, функцию единицы измерения выполняет высота строчной буквы "x" текущего шрифта. em - позволяет указать размер относительно высоты шрифта в целом.<br><br>'''Дополнительная информация по теме:'''<br />
<br />
Создание и разработка сайта в примерах - on-line-teaching.com/site/<br>Основы векторной и растровой графики - grafika-online.com<br><br><br />
<br />
<br />
<br />
Надіслав викладач інформатики Миловидов Юрій Олегович, университет «КРОК» <br />
<br />
[[Category:Структура_веб-сайтів,_різновиди_веб-сайтів._Практикуми,_лабораторні,_кейси]]</div>User16