Скачать Notepad++ Размер: 5.16 MB, скачали: 2425 раз.
Скачать браузер Mozilla Firefox 4 Размер: 12.26 MB, скачали: 552 раз.
Скачать браузер Internet Explorer 9 Размер: 23.51 MB, скачали: 455 раз.
Скачать браузер Opera 11.10 Размер: 6.69 MB, скачали: 570 раз.
- Разархивировать скачанный файл.
- Открыть папку index.
- Запустить файл index.html в браузере.
Знакомство с HTML и CSS
Здравствуйте, уважаемый слушатель. Мое имя — Олег Зубцов. Я вас приветствую в видеокурсе по CSS (Cascading Style Sheet – каскадные таблицы стилей). Каскадные таблицы стилей — это просто напросто прорыв науки в оформлении веб-страниц. Но, прежде чем приступать к изучению CSS, Вам нужно владеть знаниями языка HTML. Если Вы не знакомы с HTML или недостаточно уверены в своих знаниях, то я рекомендую Вам для начала изучить видеокурс по HTML, а уже потом переходить к CSS.
Приступить к изучению видеокурса по HTML немедленно!
В этом видеокурсе я буду давать материал с учетом того, что вы уже знакомы с языком разметки HTML. Если же вы его не изучали ранее, то вы можете изучить его, скачав диск с нашего сайта. Чтобы скачать видеокурс, вам нужно перейти на страничку HTML, после чего нажать на ссылку «скачать полностью ехе-файл». После нажатия на ссылку в новом окне откроется веб-страница, на которой будет указан размер файла. Для скачивания остается только нажать одну кнопку. После нажатия этой кнопки у вас выскакивает запрос о сохранении этого файла на ваш компьютер. Вы нажимаете «Сохранить» и он у вас сохраняется.
Что такое CSS?
Вернемся к CSS. Так за что же он отвечает? А CSS отвечает у нас за оформление сайта. Если HTML отвечает за расположение на нем блоков, текста, изображений, то CSS может придавать стили этим элементам, а также влиять на их отображение. Например, у меня на сайте левый и правый блоки оформлены с помощью CSS, кнопочка тоже оформлена с помощью CSS и т. д. Даже когда я ставлю курсор в поле поиска, то оно подсвечивается — и это тоже CSS. Красиво, не правда ли? Более того, чтобы поменять цвет ссылок справа мне нужно будет заменить только одну строчку в файле CSS. Цвет этих ссылок поменяется на всех страницах. Удобно, красиво и профессионально.
Какое же программное обеспечение мы будем использовать при изучении? Если вы проходили мой видеокурс по HTML, то наверняка знакомы с программой Notepad++. Это замена блокноту. Работать в нем комфортнее. Программа бесплатная, и я прикладываю ссылку на скачивание к этому видеоуроку.
На этом я заканчиваю вступительный видеоурок. Надеюсь, я вас заинтересовал и заинтриговал. Приглашаю пройти вас к следующему видеоуроку, в котором мы познакомимся с теоретической частью CSS.
Здравствуй, Олег. Посмотрел курс по HTML мне понравилось и многое узнал, где то запутался, что-то не понял, но думаю практика всё исправит. Что изучать дальше? CSS или php? создаю потихоньку сайт, хочется конечно посимпатичней, то есть мой сайтwww.video-art-studio.ru сделан по шаблону и с помощью вордпресс. А я хочу сам без шаблонов создать красивый сайт о городе. Спасибо.
Спасибо за комментарий. Курс по CSS постараюсь сделать еще лучше.
Желательно изучать CSS. PHP пока рановато. В наших планах выпускать видеокурсы в последовательности их важности и необходимости =)
Скоро выйдет «стартовый» видеокурс для новичков, в котором будет описана последовательность изучения языков, их особенности, программы при работе и многое другое.
Сейчас же, я буду выпускать видеоуроки по CSS. Кстати, сегодня появится 3-ий 😉
В этом вам понадобится CSS, знание правильной верстки HTML+CSS (этот видеокурс выйдет чуть позже) и умение работать в программе Photoshop (курс по Photoshop'у мы также собираемся выпустить позже).
Доброй ночи. Хотелось бы узнать, сколько стоит реклама на вашем форуме?
Я вам напишу на e-mail, обсудим. 😉
Спасибо Вам огромное! Ну фотошоп я знаю, не на 100 процентов конечно, то что то умею. Очень жаль что пока мало уроков по css ибо ваш курс по html увлекательный и вот за пару дней я сделал простенький сайт о самолётах). Ну добавил картинок, хочется теперь вот немного его сделать покрасивее, а для этого и нужен css как я понимаю. было бы неплохо если бы ваши уроки по css были бы редактирования сайта именно того на чём мы учились в html. Думаю так будет понятней!.
Почти все уроки по CSS будут записаны на файле index.html, который взят из курса по html и отредактирован(убрано все лишнее).
Скоро наверстаем упущенное 😉
Ваще супер, ты молодец! И ещё)) сюда можно вопросы задать по курсу html? ну я просто кое что не понял
Без проблем. Но лучше задать к тому уроку, в котором что-то не понятно, чтобы тот, кто столкнется с такой проблемой, увидел сразу на нее ответ 🙂
Здравствуйте ещё раз, даже не знаю с чего начать. Вопросов море, уж не знаю наверное не к конкретному уроку, в общем щас напишу несколько вопросов. 1) Я что то запутался в рамках (border), загрузил кучу фоток на страницы сайта, рамка чёрная, хочу поменять цвет. Ни как не пойму где прописать это 2) Сделал в after effects небольшую анимацию, сохранил в gif и вау!!! повесив под меню, анимация идёт, решил так же сделать шапку, но при изменение пути к шапке то есть к примеру первая была <img src="header.png", а вторая <img src="header2.gif" после изменения картинка просто пропадает. 3) У меня есть картинка в footer я хочу добавить на неё картинок. к примеру наша почта, наша аська и т.д, как это сделать? Это можно сделать лишь путём как в уроке "11" ? или же есть ещё варианты. у вас на сайте я вижу ссылки, правда текстом, но думаю суть одна. Заранее спасибо за ответы и огромное спасибо за новые уроки по CSS жаль что 4-урок ещё не вышел, буду ждать. Ещё раз респект Вам!
В одном из уроков по CSS мы будем это проходить. Если «горит» сейчас, то попробуйте прописать атрибут border-color к изображению.
Проверьте путь к изображению, проверьте формат изображения(gif, jpg), проверьте регистр. Если все верно, но все равно не работает, скопируйте пожалуйста код в комментарий. Чтобы код отобразился, его нужно будет добавить с помощью кнопки код, указав атрибуту lang значение html.
Это делается с помощью CSS.
Всегда рад помочь. Видеоурок появится на сайте в ближайшие два дня. 😉
я прописал border-color... явно я где то запутался((((
Вы делаете все верно. Проблема в самом атрибуте. Он раньше когда-то принимался браузерами, но теперь большинство браузеров отказались его поддерживать.
Какой выход из ситуации? — задать цвет рамки посредством CSS. В курсе по CSS я специально запишу видеоурок по рамкам.
Стоит отметить, что благодаря CSS, не придется задавать цвет рамки для каждого изображения, что будет значительно удобнее(если вдруг возникнет нужда поменять цвет рамки, то нужно будет заменить лишь 1-строчку в CSS).
с шапкой всё понял, Вы были правы, просто тупо запихнул её не в ту папку(((((( не внимателен был, извините
ничего страшного. Со всеми бывает.
Я сам иногда такие глупые ляпы совершаю 🙂
Спасибо огромное, вижу урок 4 появился, завтра буду смотреть!!! То есть в моём коде нет ни чего лишнего? Я дико извиняюсь не правильно видимо код вам выслал. И пока ещё вопросик как прописать что бы была иконка сайта в строке где сайт...ну например как у Вас.
Да, урок появился.
Нет, лишнего ничего нету. Только вы по-моему забыли закрыть тег tr здесь:
Ничего страшного. Я поправил. Вы просто забыли указать в первой строке это: lang="html"
Нужно загрузить изображение 16×16 пикселей в формате ico с именем favicon.ico в корневую папку сайта, размещенного на хостинге. Оно автоматически у вас изменится.
Здраствуй Олег я посмотрел весь видеокурс по HTML мне понравилось на я не знаю как мне например с етой сылки file:///E:/Сузіря/index.html сделать нормальный адрес сылки напримерwww.suzirua.ua подкажи пожалуста наперед спасибо
Нужно купить место на хостинге. То есть сначала нужно купить кусочек места в интернете, чтобы туда поместить свой сайт. После того как вы купите это место, вам нужно будет зарегистрировать доменное имя для своего сайта. Это как раз «sizuria.ua» или «info-line.net». Этот этап я буду показывать в видеоуроках чуть позже, после того как обучу рисовать дизайн и верстать его.
Дам два совета, если собираетесь размещаться на хостинге в ближайшее время:
1. Настоятельно не рекомендую покупать место на дешевых хостингах, дороже выйдет. Не экономьте на этом.
2. Не спешите покупать доменное имя, не определившись с хостингом, так как на многих известных хостингах при оплате за год дается домен в подарок.
Я пользуюсь этим хостингомgoo.gl/qGd8K (ссылка на их тарифы). Сам я на тарифе «Третий». Пока проблем не было. Нравится, что есть онлайн-консультант. При оплате за год, получил 2 домена в подарок 🙂
Есть еще один хороший хостинг, который мне понравился —agava.ru
Но я выбрал первый и доволен своим решением.
Спасибо! =)
Здраствуйте а как а как на своем сайте зделать анимацию?
Что такое анимация?
Анимация — это несколько изображений, которые меняются с определенной частотой. Анимация обычно является изображением GIF формата.
С помощью чего можно сделать анимацию?
Анимацию можно сделать в программе Adobe Photoshop или в специально предназначенных для этого программах, например, GIF Animator.
Здорова Олег Зубцов мне понравилось как ты учишь html программированию мне б хотелось с тобой пообщаться как друг с другом мой логин sayan91_kz.ru
Без проблем. Только логина «sayan91_kz.ru» в скайпе не нашло.
ой извиняюсь неправильно дал логин ошибся sayan91_kz@mail.ru
или в скайпе sayanrk
добавил =)
Привет Олег Зубцов , не могли ты мне создать сойт пожалуйста буду блогодарен заранее спасибо.
моя почта rahim_gonzales@mail.ru
Привет. Я не создаю сайты на заказ пока что. А если и создаю, то у меня заказывать очень дорого. Воспользуйся сайтомfree-lance.ru
сайт зделать пожалуйста
а как зделать чтоб твой сайт выходил в поисковик?
Поисковики сами заметят твой сайт рано или поздно. Остальные подробности будут в курсе по раскрутке сайта.
а когда выйдет курс раскрутка сайта ?
Все курсы будут выходить постепенно. Курс по раскрутке сайта выйдет не скоро, но прежде, чем задумываться о раскрутке, я вам советую изучить HTML и CSS, так как это основы.
а css и php одно и тоже??
нет.
а почему утебя нету видеоуроки по php
Потому что я их не записывал.
ясно а конструктр сайтов можно там создать хороший сайт ! на ucoz.ru скажи пожалуйста или через хостинг самому писать!
Php — это язык веб-программирования. На нем можно свой движок написать.
Ucoz.ru — для новичков, так сказать. Позже мы будем изучать движки для сайтов и использовать их. Но для начала, самое главное изучить HTML и CSS.
я изучил html а css ещё не учил буду ещё учить php потом на веб дизайна!
а вот так называеться везуальный редактор adobe dreamweaver cs 5?
Да, такой визуальный редактор существует.
Artisteer 2 а вот такой везуальный редактор тож хороший подскажите пожалуйста какой лучше?
Artisteer — это скорее генератор шаблонов. Dreamweaver такие шаблоны не генерирует, но вплане редактора кода — он лучше.
а утя есть токай текстовой документ в которой есть все теги атрибуты с объяснением если есть можешь мне дать пожалуйста заранее спасибо! мой логин rahim_gonzales@mail.ru *HELP* =)
Нету, смотри видеоуроки по CSS. Я это буду рассказывать в видеокурсе 🙂 Особенно в видеоуроке про пошаговое создание красивого сайта.
а ты какой везуальный редактор испольщуешь?
Я не использую визуальный редактор, пишу все в Notepad++. Раньше пользовался Dreamweaver.
Хотел бы узнать _ откуда вы такие умные ???
Хотелось бы узнать, с чего вы взяли, что я умный?)
а вот что надо учить чтобб стать веб дизайном я уже выучил html css и ещё что надо учить скажи пожалуйста?
Тут уже ответил на твой вопрос 🙂
В одном из твоих видеоуроков услышал о существовании программы Adobe Dreamweaver и узнав о ней немного озадачился таким вопросом, так зачем изучать HTML и CSS если можно создать сайт и запустить, все же, в чем разница?
Эта программа для написания сайтов, но чтобы писать, нужно же знать, что писать. Она предоставит Вам удобства при работе, но не заменит знаний языков программирования.
Есть и еще более функциональные инструменты по созданию сайтов, например такие как Ucoz или CMS-системы. Но опять же, они помогут создать сайт, но вы будете скованы в своих возможностях. Ко мне очень часто обращаются люди, которые даже прошли специализированные курсы по созданию сайтов на CMS-системах, но они не знают ни HTML, ни CSS. Сайты их выглядят мягко говоря не очень и проблем своих решить сами, они не могут, поэтому и обращаются ко мне.
HTML, CSS — нужны обязательно. PHP — можно пренебречь 🙂