Архивы автора: admin

Лабораторная работа №4 Позиционирование элементов, таблица, формы

Задание: 1.Создать таблицу Достоинства и недостатки Достоинства: Недостатки Привлекательный внешний вид. Нелегко дрессировать и воспитывать. Не лают много. Могут быть агрессивны к животным, нужно приучать к ним. Привязчивы Охотничьи инстинкты. Нужно всерьёз заниматься обучением. 2. Создать кнопку наверх и задать ему позиционирование fixed 3. Блоку контент задать прозрачность 0.7 4. На странице контакты создать форму… Читать далее »

Лабораторная работа №3

Ссылки HTML тег a С помощью html тега <A> создаются ссылки на сайте. Причем как внешние, так и внутренние. Тег a встречается на каждой странице сайта. Если бы его не было, то было бы очень затруднительно перемещаться по интернету, поскольку каждый адрес страницы (URL) пришлось бы писать вручную. Синтаксис тега <A> <a class=«имя класса» target=«параметр»… Читать далее »

Лабораторная работа №1 по HTML

Лабораторная работа №1: Задание сверстать страницу по ссылке  Ход выполнения работы: Создайте сайт (папку) и назовите «dog» В папку «dog» создайте папку с изображениями «images» и создайте файл index.html. Откройте index.html через NotePad++ Напишите структуру html <html>       <head>         <title></title>      </head>     <body></body>   </html> Пропишите все meta тэги (<meta name=»description» content=»описание сайта»> и т.д.) Сделайте верстку… Читать далее »

Задание по HTML к двенадцатому уроку

Пример к 12 уроку HTML код <html> <head> <title>12 урок</title> <meta charset=»utf-8″> <link rel=»stylesheet» href=»style.css»> <link rel=»stylesheet» href=»style.css» media=»screen»> <meta name=»viewport» content=»width=device-width, initial-scale=1″ > </head> <body> <div class=»container»> <div class=»row»> <div class=»cols col-2″> <div class=»logo»> <a href=»index.html»><img src=»images/logo.png»></a> </div> </div> <div class=»cols col-10″> <div class=»menu»> <ul> <li><a href=»index.html»>Главная</a></li> <li><a href=»index.html»>Главная</a></li> <li><a href=»index.html»>Главная</a></li> <li><a href=»index.html»>Главная</a></li> </ul>… Читать далее »

HTML урок 12. Адаптивная модульная сетка

Ссылка на скачивание BOOTSTRAP Адаптивный дизайн представляет собой процесс организации макета сайта таким образом, что в зависимости от типа устройства пользователя или размера экрана вся важная информация подстраивается в удобной для него форме. Большинство дизайнеров выбирают макет на основе сетки, так как с ним проще работать на разных типах устройств. Право выбора остается за вами:… Читать далее »

Задание по HTML к одиннадцатому уроку

Шаблон главной страницы  Примеры адаптивной верстки по ссылке1  и ссылке2   код HTML <html> <head> <title>4 урок</title> <meta charset=»utf-8″> <link rel=»stylesheet» href=»style.css»> <link rel=»stylesheet» href=»style.css» media=»screen»> <meta name=»viewport» content=»width=device-width, initial-scale=1″ > </head> <body> <div class=»wrapper»> <div class=»header»>Блочный тег</div> <div class=»sidebar»></div> <div class=»content»> <div class=»col-3″><img src=»images/colorwebdesign.jpg»></div> <div class=»col-3″>Блочный тег</div> <div class=»col-3″>Блочный тег</div> <div class=»col-2″><img src=»images/colorwebdesign.jpg»></div> <div class=»col-2″>Блочный тег</div> <div… Читать далее »

HTML урок 11. Адаптивная верстка

Адаптивный веб-дизайн «Адаптивный веб-дизайн (англ. Responsive web design) — дизайн веб-страниц, обеспечивающий отличное отображение сайта на различных устройствах, подключённых к интернету.» Зачем нужен адаптивный веб-дизайн? 1) Большое разнообразие устройств, с которых можно выходить в Интернет. В настоящее время существует множество устройств, которыми люди пользуются, в том числе, и для того, чтобы выходить в Интернет. Все… Читать далее »

Задание по HTML к десятому уроку

Задание к двенадцатому уроку Задание 1 В блоке сайдбар создайте выпадающий список используя свойства display,position, Псевдоклассы :first-child  :last-child, псевдоэлементы ::before  и ::after. Пример страницы урок 10 Код html <div class=»sidebar»> <ul class=»ms»> <li class=»mslist»><a href=»»>Заголовок</a> <ul class=»msdrop»> <li><a href=»»>Подзаголовок</a></li> <li><a href=»»>Подзаголовок</a></li> <li><a href=»»>Подзаголовок</a></li> <li><a href=»»>Подзаголовок</a></li> <li><a href=»»>Подзаголовок</a></li> </ul> </li> <li><a href=»»>Заголовок</a></li> <li class=»mslist»><a href=»»>Заголовок</a> <ul class=»msdrop»> <li><a href=»»>Подзаголовок</a></li>… Читать далее »