[CSS]Zewnętrzne style Opcje

[Rid]

Chciałby się zapytać czy taki kod:

@charset "utf-8";
html, body {
background-color: #fff;
color: #000;
margin: 0;
padding: 0;



}


#top {
width: 995px;



}


#NAGLOWEK {
background-color: #888;
border-width: thin thick medium; border-style: solid;
height:75px;
width: 985px;

}

#MENU {
width:845px;

overflow: hidden;
background-color: #FF0000;
border-left-width: thick; border-left-style: solid;
border-right-width:medium; border-right-style: solid;
height:335px;

float: left;

}
#INFORMACJE {
width: 130px;
float: right;
overflow: hidden;
background-color: #ccc;
background-color: #FF0000;
border-left-width: medium; border-left-style: solid;
border-right-width:thick; border-right-style: solid;
height:339px;

}


#STOPKA {
clear: both;
width: 985px;
background-color: #888;
border-width: thin thick medium; border-style: solid;
height:70px;}

można zapisać w pliku zewnętrznym??

[wookieb]

A dlaczego nie?

[Rid]

Pytam się bo nie za wiele pracowałem na CSS-ach .Jak już zapisze jako zewnętrzny arkusz stylu , to w różnych dokumentach HTML , będę mógł się odnosić do części stylu np.do części #nagłówek,czy tylko do całości?
Jeśli tak ,to czy można mieszać style .np #nagłówek w style1.css ,ze #menu w style2.css i wyświetlić je w html ?

[kadlub]

no jasne żę można nazywasz plik np kod.css

a później w head wpisujesz

[HTML] pobierz, plaintext 
<link rel="stylesheet" type="text/css" href="kod.css" />
 
[HTML] pobierz, plaintext 

Ten post edytował kadlub 5.01.2011, 11:44:31

[Rid]

Chodziło mi o mieszanie styli, czy to będzie efektowne,jeśli trzeba wczytywać cały plik css a a mamy np2.lub 3 pliki,to czy czas wczytywania strony html się nie wydłuży.

[wookieb]

Pytasz o umieszczenie styli w pliku css a rzeczywiście chodzi Ci o coś innego. Naucz się zadawać w końcu pytania.
Lepszy jeden plik ze względu na zmniejszenie ilości żądań do serwera.

[kadlub]

<link rel="stylesheet" type="text/css" href="arkusz1.css" />
<link rel="stylesheet" type="text/css" href="arkusz2.css" />
w arkuszu1 możesz mieć np blok o id menu a w arkuszu2 np blok o id nagłówek
jak ja mieszałem nie zauważyłem żeby mi się wydłużył a jak coś to nieznacznie tylko uważaj żebyś w dwóch arkuszach nie odwoływać sie do tego samego id lub class i w obu nie ustawiać dwa razy body bo może sie trochę poplątać

Ten post edytował kadlub 5.01.2011, 12:08:08

[Rid]

Dziękuję za zainteresowanie

[bigbadcompany]

Jeśli to ma być złożony css to lepiej żebyś w głównym pliku trzymał tylko najpotrzebniejsze informacje a w kolejnych zajmował się np. ułożeniem wewnętrznych tabeli, a jeśli już jesteśmy przy tym temacie to nie bój się pracować na plikach możesz je z łatwością importować z głównego css'a. Tworzysz plik style.css a w nim na górze dopisujesz

@import url(nazwa-1.css);
@import url(nazwa-2.css);

W ten sposób możesz dowolnie mieszać komponenty styli i w prosty sposób odnaleźć to co cię w danej chwili interesuje. Ponadto w tagach strony wstawiasz tylko jeden tak czyli:

<link rel="stylesheet" href="style.css" type="text/css" />

A nie kilka tagów jeden pod drugim.

<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="lewo.css" type="text/css" />
<link rel="stylesheet" href="prawo.css" type="text/css" />

Czemu tak ? Bo lepiej żebyś załadował to z poziomu css'a niż index'u gdyż nie ma sensu go powiększać takimi głupotami.

[Rid]

Czyli tworzę głównego css-a,nazwijmy go glowny.css i dodajemy tylko

@import url(nazwa-1.css);
@import url(nazwa-2.css);

a w htmlu wpisujemy

[HTML] pobierz, plaintext 
<link rel="stylesheet" href="glowny.css" type="text/css" />
[HTML] pobierz, plaintext 

-gdzie mamy już gotową mieszankę styli.
Jak tak,to jest najoptymalniejsze rozwiązanie,z w/w jakie mi Podsunąłeś.Jeśli dobrze to rozumiem.
Dziękuję Ci bardzo:)

[wookieb]

Ale to nadal powoduje wywołanie 3 requestów a nie jednego...

[bigbadcompany]

Ale to nadal powoduje wywołanie 3 requestów a nie jednego...

No tak, ale nie robi tego z indeksu tylko z pliku css'a. Według mnie to bardziej praktyczne niż umieszczać kilkanaście tagów w pliku który pobiera się najczęściej przy przeglądaniu strony. Zresztą każdy robi jak lubi i jak potrafi mnie odpowiada takie rozwiązanie

Rid:

Pamiętaj, że nazwa-1.css i każde kolejne czyli nazwa-2.css itd. muszą być w tym samym katalogu co główny css chyba, że zmienisz ścieżkę dostępu

z

@import url(nazwa-1.css);

na np:

@import url(jakis-katalog/nazwa-1.css);

Jak pracujesz na mniejszych pliczkach opisanych tak jak chcesz szybciej je znajdziesz i poprawisz. Podzielisz sobie np. ankieta.css, subskrypcja.css
Ponadto sposób jest dobry jak ftp się ślimaczy i często się wywala na odczytywaniu większych plików z serwera. Zawsze lepiej zapisać pliczek
ankieta.css który ma 2-3 kb niż jeden cały style.css który ma 150 kb