Как да създадете CSS (с илюстрации)

CSS е езикът на таблиците в стила, чрез които можете да създавате уеб страници и едновременно да контролирате множество функции, да задавате групи от определени елементи. Например, като използвате цветен код, дизайнерът може да промени цвета на фона на всички страници на сайта, като направи една промяна в CSS код.

Стъпка

Част 1 от 4:

Как да напишете вграден код CSS

един. Проверете HTML таговете. Трябва да знаете как работят етикети и атрибути SRC и href.

Изображение, озаглавено Създаване на CSS стъпка 2

2. Разгледайте някои от Основните свойства на CSS. Има много имоти, но не си спомням всичко.

Не забравяйте следните ключови имоти CSS: Цвят и Шрифтово семейство.

Изображение, озаглавено Създаване на CSS стъпка 3

3. Проверете стойностите на съответните свойства. За всеки имот показва стойността. Например, за свойства Цвят Можете да посочите стойността червен.

Изображение, озаглавено Създаване на CSS стъпка 4

4. Проверете HTML атрибута Стил. Използва се вътре в елемента href или SRC. За да използвате посочения атрибут в кавички след равен знак, въведете атрибута CSS, дебелото черво и след това стойността на имота. Това се нарича CSS правило.

Изображение, озаглавено Създаване на CSS стъпка 5

пет. Моля, обърнете внимание, че професионалните уеб разработчици обикновено не използват вградения CSS код за създаване на сайтове. Вграденият CSS код може да наруши целостта на HTML кода. Въпреки това, това е чудесен начин да се запознаете с основите на функционирането на CSS.

Част 2 от 4:

Как да напишете прост код CSS

един. Стартирайте програмата, в която можете да създавате HTML и CSS файлове.

Ако няма специална програма, използвайте Notepad или друг текстов редактор. Просто запазете файла като текстов файл и CSS файл.

Изображение, озаглавено Създаване на CSS стъпка 7

2. Отворете HTML код. Направете го в HTML редактор (ако е).

В HTML редактора можете да работите с HTML код и с CSS код.

Изображение, озаглавено Създаване на CSS стъпка 8

3. Създаване на тагове Tag . В този случай кодът CSS може да бъде написан без необходимостта от създаване на отделен файл.

Изображение, озаглавено Създаване на CSS стъпка 9

4. Изберете елемента, към който искате да добавите стил. Сега въведете името на елемента и къдрави скоби ({ }Чест. За да направите кода по-разбираем, втората къдрава скоба винаги влиза в новата линия.

Изображение, озаглавено Създаване на CSS стъпка 10

пет. Вътре в скобите въведете правилото CSS, сякаш сте използвали атрибут Стил. Всеки низ трябва да завърши с точка и запетая (-). За да се счупи кодът, всяко правило се въвежда на отделен ред и всеки ред трябва да има тире.

Моля, обърнете внимание, че този стил ще повлияе на всички елементи на избрания тип на страницата. В следващия раздел ще бъде преразгледан по-конкретен стил.

Част 3 от 4:

Как да напишете по-сложен CSS код

един. Създайте CSS файл (и не html файл) и го запазете с разширението .CSS. Също така отворете HTML файл.

Изображение, озаглавено Създаване на CSS стъпка 12

2. Създаване на тагове Tag . Така ще свържете отделен CSS файл с HTML файл. За тагове Необходими са три атрибута: Rel, Тип и href.

Rel Указва браузъра как да се лекува HTML файл. Тук този атрибут трябва да има значение Стилове.

Тип Доклади до какъв вид медии се отнася до. Тук този атрибут трябва да има значение Текст / CSS

href тук се използва по същия начин, както в елемента , Но тук този атрибут трябва да се обърне към файла CSS. Ако CSS файлът е в една папка с HTML файл, задайте само името на файла в кавички.

Изображение, озаглавено Създаване на CSS стъпка 13

3. Изберете елементите от различни типове, за които искате да добавите един стил. Добавете атрибут Клас на такива елементи и ги приравняват към името на избрания клас. В този случай елементите ще бъдат същия стил.

Изображение, озаглавено Създаване на CSS стъпка 14

4. Посочете какъв стил ще получи клас. В CSS файла въведете името на класа след точката ., Това е така: .Клас.

Изображение, озаглавено Създаване на CSS стъпка 15

пет. Изберете отделни елементи, към които искате да добавите специален стил и добавете атрибут документ за самоличност. Идентификаторите на CSS се създават с помощта на символ #, не точка.

Идентификаторите са по-специфични от класовете, така че идентификаторът отменя всеки клас стил, ако има атрибут със стойност, различна от стойността на класа.

Част 4 от 4:

Как да научите CSS и HTML

един. Отворете сайта HTML академия. Върху него можете да научите основите на уеб разработката.

Изображение, озаглавено Създаване на CSS стъпка 17

2. Намерете други сайтове, специално проектирани да изследвате HTML и CSS.Потърсете авторитетни източници, за да умножите знанията си.

Изображение, озаглавено Създаване на CSS стъпка 18

3. Общувайте с уеб дизайнери и разработчици. Техният опит ще ви помогне да овладеете ценните знания и умения.

Изображение, озаглавено Създаване на CSS стъпка 19

4. Преглед на изходните кодове на сайтовете, които отваряте. Преглед на CSS кодове, направени уебсайтове, ви позволяват да се запознаете с методите за разработване на части от уебсайтове. Копирайте кода и след това го редактирайте, за да научите как да използвате различни CSS атрибути.

Съвети

Има много различни свойства, които могат да бъдат манипулирани с помощта на CSS. Намерете уебсайт, който ви харесва и преглеждате своя източник. Ако вътрешните тагове имат име на CSS файл, кликнете върху него, за да видите различни свойства и стойности, присвоени на елементи.

Предупреждения

Копирането на HTML и CSS кодове ще ви помогнат в обучението, но трябва да използвате собствените си дизайнерски идеи. Използването на някой друг дизайн е кражба и плагиатство.