20 Корисни ЦСС савети за почетнике

У старим временима, ми много зависимо од програмера и програмера који помажу у ажурирању веб сајта, чак и када је само мањи. Захваљујући ЦСС-у и његовој флексибилности, стилови се могу издвојити независно од кодова. Сада, уз основно разумијевање ЦСС-а, чак и почетник може лако промијенити стил веб-локације.

Било да сте заинтересовани да покупите ЦСС да бисте креирали сопствени сајт, или само да бисте подесили изглед и осећај вашег блога - увек је добро почети са основама да бисте добили јачу основу. Погледајмо неке ЦСС Типс за које смо мислили да ће бити корисно почетници. Комплетна листа после скока.

1. Усе ресет.цсс

   Када је у питању приказивање ЦСС стилова, претраживачи попут Фирефока и Интернет Екплорера имају различите начине за њихово руковање. ресет.цсс ресетује све основне стилове, тако да почињете са правим празним новим стиловима.

   Ево неколико најчешће коришћених ресет.цсс оквири - Иахоо Ресет ЦСС, ЦСС Ресет Ериц Меиер, Триполи

2. Користите кратки ЦСС

   Кратки ЦСС вам даје краћи начин писања ЦСС кодова, а најважније од свега - чини га јаснијим и лакшим за разумевање.

   Уместо креирања ЦСС-а овако

   .заглавие бацкгроунд-цолор: #ффф; бацкгроунд-имаге: урл (имаге.гиф); позадина-понављање: нема понављања; позиција у позадини: горе лево; 

   Може се укратко пренијети на сљедеће:

   .хеадер бацкгроунд: #ффф урл (слика.гиф) но-репеат горњи леви

   Више - Увод у ЦСС скраћеницу, Корисне ЦСС скраћенице

3. Ундерстандинг Класа и ИД

   Ова два селектора често збуњују почетнике. Ин ЦСС, класа је представљена тачком "." док ид је хасх '#' ид користи се за стил који је јединствен и не понавља се, класа са друге стране, може бити поновна употреба.

   Више - Цласс вс. ИД | Када се користи класа, ИД | Примените класу и ИД заједно

4. Снага

5. а.к.а линк лист, је веома користан када се исправно користе
   или
   , посебно да стилизујете навигациони мени.

   • Заборави , покушати

     Једна од највећих предности ЦСС-а је употреба

     да постигне потпуну флексибилност у погледу стила.

     су за разлику од

     , где су садржаји 'закључани' унутар а

     ћелије. Сигурно је највише рећи распореди су оствариви уз употребу и правилан стил, добро можда осим масивног табуларног садржаја. Више - Столови су мртви, Таблес Вс. ЦСС, ЦСС вс табеле ЦСС алати за отклањање грешака Увек је добро да одмах прегледате изглед док подешавате ЦСС, помаже вам да боље разумете и откријете ЦСС стилове. Ево неких бесплатних ЦСС алатки за отклањање грешака које можете да инсталирате на вашем претраживачу: ФиреФок Веб Девелопер, ДОМ Инспецтор, Интернет Екплорер Девелопер Тоолбар и Фиребуг. Избегавајте сувишне селекторе Понекад ваша ЦСС декларација може бити једноставнија, што значи ако нађете кодирање следеће: ул ли … ол ли … таб тр тд … Могу се скратити на само ли … тд … Објашњење: ће постојати само унутар или и и ће бити само унутра тако да стварно није потребно поново их уметати. Кновинг !важно Сваки стил означен са !важно ће се користити без обзира на то да ли испод њега постоји правило преписивања. .паге бацкгроунд-цолор: блуе! позадинска боја: црвена; У горњем примеру, боја позадине: плава ће бити прилагођен јер је означен са !важно, чак и када постоји боја позадине: црвена; испод њега. !важно се користи у ситуацији када желите да форсирате стил без да га нешто препишете, али можда неће радити у програму Интернет Екплорер. Замените текст сликом Ово је обично пракса да се замени титле од наслова заснованог на тексту до слике. Ево како то радите. х1 тект-индент: -9999пк; бацкгроунд: урл ("титле.јпг") но-репеат; видтх: 100пк; хеигхт: 50пк; Објашњење: тект-индент: -9999пк; избацује ваш екран са наслова текста, замењен сликом коју је објавио бацкгроунд: … са фиксним видтх и хеигхт. Разумевање ЦСС позиционирања Следећи чланак вам даје јасно разумевање коришћења ЦСС позиционирања - позиција: … Више - Научите ЦСС позиционирање у десет корака ЦСС @увоз вс Постоје два начина да позовете спољни ЦСС фајл - односно користећи @увоз и . Ако нисте сигурни који метод ћете користити, ево неколико чланака који ће вам помоћи да одлучите. Више - Разлика између @импорта и линка Дизајнирање образаца у ЦСС-у Веб форме се могу лако дизајнирати и прилагодити помоћу ЦСС-а. Следећи чланци вам показују како: Више - Облик без табеле, Форм Гарден, Стилизовање још више облика контроле Добити инспирацију Ако сте у потрази за добро дизајнираним ЦСС-базираним веб страницама за инспирацију, или једноставно прегледавате да бисте пронашли неки добар УИ, ево неких ЦСС презентацијских страница које препоручујемо: ЦСС Ремик ЦСС Беаути ЦСС Елите ЦСС Маниа ЦСС Леак Чувајте ЦСС кодове Ако су ваши ЦСС кодови неуредни, завршићете кодирањем у конфузији и тешко ћете се позабавити претходним кодом. За почетак, можете креирати одговарајућу увлачење, правилно их коментирати. Више - 12 Начела за чување вашег кода, Форматирање ЦСС кодова на мрежи Мерење типографије: пк вс ем Проблем при избору када се користи мерна јединица пк или ем? Сљедећи чланци могу вам дати боље разумијевање типографских јединица. ЦСС Бровсерс Цомпатибилити Табле Сви знамо да сваки претраживач има различите начине приказивања ЦСС стилова. Добро је имати референцу, графикон или листу која приказује целокупну ЦСС компатибилност за сваки претраживач. ЦСС табела подршке: # 1, # 2, # 3, # 4. Дизајн мултицолумнс у ЦСС Имате проблем да исправно поравнате леву, средњу и десну колону? Ево неколико чланака који могу помоћи: У потрази за Светим Гралом Фаук Цолумнс Врхунски разлози због којих су ваше ЦСС колоне забрљане Литте кутије (примери) Мулти-Цолумн Лаиоутс излази из кутије Абсолуте Цолумнс Набавите бесплатне ЦСС уреднике Наменски уредници су увијек бољи од нотепада. Ево неких које препоручујемо: Више - Симпле ЦСС, Нотепад ++, ЦСС Едитор Разумевање врста медија Постоји неколико типова медија када декларишете ЦСС . штампа, пројекција и екран су неке од најчешће коришћених типова. Разумевање и коришћење на прави начин омогућава бољу приступачност корисника. Следећи чланак објашњава како се носити са ЦСС Медиа типовима. Више - ЦСС и врсте медија, Врсте медија В3, ЦСС Медиа Типес, ЦСС2 Медиа Типес 20 Корисне иПхоне апликације за програмере и дизајнере 20 Корисни СВГ алати за бољу графику 20 Ултра лагани и елегантни фонтови за веб дизајнере Следећи чланак 20 Корисни додаци за Фирефок Сидебар Превиоус артицле 20 Корисне апликације да бисте добили највише из Инстаграм