Урок 1. Что такое CSS? Новый этап в развитии Вас, как вебмастера!

Содержание статьи:
1. Причем тут CSS
2. Что такое CSS
3. Пример работы CSS
4. Как работает CSS

Здравствуйте, уважаемые читатели проекта «Анатомия Бизнеса»! Вас приветствует вебмастер Александр! Как Вы могли заметить, в рамках данного проекта Вы можете найти не только инструкции по запуску бизнеса, но и полезную информацию касаемо сайтостроения

Причем тут СSS?

Дело в том, что последние три года я занимаюсь бизнесом в сети, но при всем при этом не имею никакого представления о программировании на PHP, HTML и тем более CSS.
Есть у меня одна цель, о которой я хочу Вам рассказать… Минимальный план на жизнь — это изменить мир! Возможно, громко сказано, но это действительно так.

Как это сделали когда-то Бил Гейтс, Стив Джобс, Возняк, Павел Дуров, Марк Цукерберг и другие гении человечества. Всех их объединяет то, что они создали проекты, которые изменили мир современного человека.

Попивая чай, я начал задумываться над тем, как это могу сделать я? Есть десятки идей, которые я бы хотел реализовать во всемирной паутине, но знаний того, как эта паутина работает изнутри, у меня нет.

Итак, мои исходные данные:
– Хорошие знания в области продвижения в социальных сетях
– Базовые знания в области HTML
– Гуманитарный склад ума (О Боже, куда я лезу! Там же одна математика!)
– Упертый характер (Как баран — привык идти до конца!)

Имея все выше сказанное, я решил, что за этот год мне нужно как минимум изучить три основных направления: PHP, HTML, CSS, до уровня продвинутого пользователя.
И эта статья будет моим первым шагом в освоении этих направлений!

Что такое CSS?

Сразу хочу сказать, что все мои статьи будут писаться максимально понятным языком, для простого обывателя. Как Вы помните, у меня гуманитарный склад, о чем я писал выше. Поэтому я буду стараться писать не «сухим техническим языком», а скорее «гуманитарным».

Итак, перейдем непосредственно к делу.
Официальное определение CSS (Cascading Style Sheets) – Каскадные Таблицы Стилей.
Далее на большинстве сайтов идет определение, что СSS-стили — это правила отображения html-файла посредством CSS-файлов. Согласитесь, звучит немного запутано.
Переведу на более понятный человеческий язык. HTML можно рассмотреть как скелет в человеческом организме. Но, согласитесь, скелет в отдельности от кожи и мышц не очень-то и симпатичен. Для того чтобы увидеть на наглядном примере, как CSS влияет на отображение сайта, нам понадобится установить на свой компьютер расширение Web Developer 1.2.3. для браузера Mozilla Firefox. О том, как это делается, я рассказал в статье «Удобные расширения для Mozilla Firefox»

Пример работы CSS

Итак, мы установили расширение Web Developer, теперь заходим на всеми нами любимый Yandex. Мы видим его в привычном для нас отображении:

chto_takoe_CSS

Расширение WebDeveloper позволяет отключать отображение CSS-стилей на сайте. Делается это путем перехода и нажатия «CSS» => «Disable Style» => «Disable All Style»

chto-takoe-CSS-1

И что мы видим перед собой?
chto-takoe-CSS-4
Весьма неприглядную картину… Вроде, все те же ссылки, но выглядит все пусто и некрасиво (((
Теперь Вы понимаете, какое значение CSS имеет на данный момент в сайтостроении.

Как работает CSS?

Тут все достаточно просто для понимания. У нас есть html-файл, который содержит в себе большое количество различных тегов и изображений. Благодаря CSS мы можем задать определенные правила отображения целых групп тегов. Например, вместо того чтобы задавать в html-файле к каждому тегу «h», каким цветом его отображать, мы можем через CSS-файл дать задание, чтобы все строки, имеющие в своем составе тег «h», отображались определенным цветом!

Для чего это нужно? Представьте, что у нас страница, на которой около 6 заголовков, выделенных тегом «h». Как будет проще: к каждому из этих заголовков в ручном режиме прописывать цвет или через CSS дать одно общее правило? Конечно, второй вариант намного проще! А если у Вас сайт, состоящий из сотен страниц? Вы можете к каждой прописывать все ручками, а можете научится работать с CSS. Вот почему я начал изучать и применять CSS!

Вот такой у нас получился первый урок! Друзья, если Вам что-то не понятно, пишите свои вопросы в комментариях. Постараюсь дать максимально подробные ответы.


С уважением проект Анатомия Бизнеса

Рубрики:

7 октября, 2014 10:18 пп

Comments are closed here.


Если Вам понравился опубликованный материал – поделитесь им с Вашими друзьями: