Разбирање на 3 вида на стилови на CSS

Вградени, вградени и надворешни стилски листови: Еве што треба да знаете

Развојот на веб-страниците на предната страна често е претставен како столче со 3 нозе. Овие нозе се како што следува:

Вториот дел од оваа столица, CSS или Cascading Style Sheets, е она што го гледаме тука денес. Поточно, ние сакаме да ги адресираме 3 видовите на стилови кои можете да ги додадете во некој документ.

  1. Вградени стилови
  2. Вградени стилови
  3. Надворешни стилови

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

Вградени стилови

Вградените стилови се стилови кои се напишани директно во ознаката во HTML-документот. Вградените стилови влијаат само на специфичната ознака на која се примени. Еве пример за втиснат стил применет на стандардна врска, или сидро, ознака:

Ова правило CSS ќе ја претвори стандардната нагласување на декорацијата на текстот од оваа врска. Меѓутоа, нема да се промени било која друга врска на страната. Ова е едно од ограничувањата на втисните стилови. Бидејќи тие само се менуваат за одредена ставка, ќе треба да го отпалите вашиот HTML со овие стилови за да постигнете вистински дизајн на страници. Тоа не е најдобра практика. Всушност, еден чекор е отстранет од деновите на "фонт" тагови и мешавината на структура и стил во веб-страниците.

Вградените стилови, исто така, имаат многу висока специфичност.

Ова ги прави многу тешко да се презапише со други, не-вродени стилови. На пример, ако сакате да направите сајт одговорен и да промени како елемент изгледа на одредени точки на прекин со користење на медиумски пребарувања , втисните стилови на елементот ќе го направат тоа многу тешко.

На крајот на краиштата, вградените стилови се навистина соодветни кога се користат многу повремено.

Всушност, ретко кога ги користам стилските стилови на моите веб страни.

Вградени стилови

Вградени стилови се стилови кои се вградени во главата на документот. Вградените стилови влијаат само на ознаките на страницата во која се вградени. Уште еднаш, овој пристап ја негира една од предностите на CSS. Бидејќи секоја страница ќе има стилови во

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

Стилови што се додаваат во

на документ, исто така, додаде значителен износ на означувачкиот код на таа страница, што исто така може да ја направи страната потешка за управување во иднина.

Во корист на вградени стилски листови е тоа што товарот веднаш со самата страница, наместо да се бара да се вчитаат други надворешни датотеки. Ова може да биде корист од брзината на преземање и перформансите на перформансите .

Книги за надворешни стилови

Повеќето веб-сајтови денес користат надворешни стилски листови. Надворешни стилови се стилови кои се напишани во посебен документ, а потоа прикачени на разни веб-документи. Книгите за надворешни стилови можат да влијаат врз кој било документ за кој се прикачени, што значи дека ако имате веб-страница од 20 страници, каде што секоја страница го користи истиот стилски лист (ова е обично како е направено), можете да направите визуелна промена на секој од тие страници со едноставно уредување на тој стилски лист.

Ова го прави долгорочното управување со локации многу полесно.

Недостатоци на надворешните стилски листови е дека тие бараат страници да ги преземат и вчитаат овие надворешни датотеки. Не секоја страница ќе го користи секој стил во CSS листот, така што многу страници ќе вчитаат многу поголема CSS-страница од онаа што навистина е потребна.

Иако е точно дека постои хит на изведба за надворешни CSS-датотеки, тоа сигурно може да се минимизира. Реално, CSS-датотеките се само текстуални датотеки, па затоа обично не се многу големи за да започнат. Ако целата своја страница користи 1 CSS-датотека, исто така добивате корист од тој документ да биде кеширан откако е на почетокот натоварен.

Ова значи дека на првата страница може да има мала изведба на неколку посети, но следните страници ќе ја користат кеширана CSS-датотека, па секој хит ќе биде негиран. Надворешните CSS-датотеки се како да ги изградам сите мои веб-страници.