Добро пожаловать на наш третий урок . Сегодня мы начнем изучать новый язык программирования и это CSS. Как он работает? CSS - позволяет менять вид отображаемого в браузере. Как я ранние и говорил ,что надо платить деньги за создание сайта, и если вам нужно опубликовать сайт, то заходите по ссылкам: Украина-imena.ua; Россия-jino.ru. Я извиняюсь за  большую паузу в полгода, так как сам пытался освоить данный язык программирования. Теперь давайте приступать к уроку!


У CSS очень много свойств, сегодня мы рассмотрим только основные, и то , только половину, если вы хотите узнать больше про свойства CSS, тогда переходите по ссылке - Справочник CSS

Открываем Блокнот, в новом окне открываем файл osnova.html из папки TheWebsiter, имеем следующий код:

<!DOCTYPE html>
<html>
<head>
 <title></title>
</head>
<body>
 <p></p>
</body>
</html>

Сегодня мы рассмотрим следущие cтили  СSS:

1)background-color(задает цвет текста)

2)color(задает цвет текста)

3)height(высота)

4)width(ширина)

5)border(помещает елемент в рамку)

Давайте словим двух зайцев, одним махом, пишем следующий код:

<!DOCTYPE html>

<html>

<head>

 <title>СSS</title>

</head>

<body>

    <div style="color: red;">

   <div style="background-color: green; height: 300px; width:300px;">

     <p>Считалось ,что динозавры вымерли давным давно, но кто это?</p>

    <div style="border: 4px solid blue; height: 225px; width:225px ">

       <img src="dinosavr.jpg"/>

</body>

</html>

В данном случаи мы словили 5 зайцев одним махом, но не суть, вам наверное не понятно что такое <div>.<div>- это основной тег CSS, который показывает html, что дальше операции будут проводиться с CSS. Вот разбор:


Думаю, вам все понятно, с верхней картинки, если да , то предлагаю вспомнить превидущие уроки первый, второй и пройти тест, а также посмотреть результат:


Спасибо, до скорых встреч!




Комментарии

Отправить комментарий