TechCodeview

CSS (kaskadowy arkusz stylów) opisuje elementy HTML, które są wyświetlane ekran, papier lub w inne media . Oszczędza dużo czasu. Kontroluje układ wielu stron internetowych jednocześnie. Ustawia rozmiar czcionki, rodzina czcionek, kolor, kolor tła na stronie.

Pozwala nam dodawać efekty Lub animacje do strony internetowej. Używamy CSS do wyświetlenia animacje tak jak przyciski, efekty, moduły ładujące Lub błystki , i również animowane tła .

Bez używania CSS , strona nie będzie wyglądać atrakcyjnie. Tam są 3 rodzaje CSS które są poniżej:

• Wbudowany CSS
• Wewnętrzny/wbudowany CSS
• Zewnętrzny CSS

1. Wewnętrzny CSS

Wewnętrzny CSS ma tag w sekcja HTML dokument. Ten styl CSS to skuteczny sposób na stylizację pojedynczych stron. Używanie stylu CSS dla wielu stron internetowych jest czasochłonne, ponieważ wymaga umieszczenia pliku styl na każdej stronie internetowej.

Możemy użyć wewnętrznego CSS, wykonując następujące kroki:

1. Najpierw otwórz plik HTML stronę i zlokalizuj plik

2. Umieść następujący kod po

3. Dodaj zasady CSS w nowej linii.

Przykład:

 body { background-color: black; } h1 { color: white; padding: 50px; } 

4. Zamknij znacznik stylu.

Po dodaniu wewnętrznego CSS, kompletny plik HTML wygląda następująco:

 body { background-color: black; } h1 { color: red; padding: 50px; } <h2>CSS types</h2> <p>Cascading Style sheet types: inline, external and internal</p> 

Możemy także skorzystać z selektorów (klasa i identyfikator) w arkuszu stylów.

Przykład:

 .class { property1 : value1; property2 : value2; property3 : value3; } #id { property1 : value1; property2 : value2; property3 : value3; } 

Zalety wewnętrznego CSS

Wewnętrzny CSSnie można przesłać wielu plików, gdy dodajemy kod ze stroną HTML.

Wady wewnętrznego CSS:

• Dodanie kodu w HTML dokument zmniejszy rozmiar strony I czas ładowania strony internetowej.

2. Zewnętrzny CSS

W zewnętrznym CSS łączymy strony internetowe z zewnętrznymi .css plik. Jest tworzony przez Edytor tekstu . CSS jest bardziej efektywną metodą stylizacji strony internetowej. Edytując plik .css pliku, możemy od razu zmienić całą witrynę.

Aby użyć zewnętrznego CSS, wykonaj kroki podane poniżej:

1. Utwórz nowy .css plik z Edytor tekstu , i dodaj Arkusz Stylów Kaskadowych zasady też.

Na przykład:

 .xleftcol { float: right; width: 35%; background:#608800; } .xmiddlecol { float: right; width: 35%; background:#eff3df; } 

2. Dodaj odniesienie do zewnętrznego .css plik zaraz po tag w Sekcja Arkusz HTML :

Zalety zewnętrznego CSS:

• Nasze pliki mają czystszą strukturę i mniejszy rozmiar.
• Używamy tego samego .css plik dla wielu stron internetowych w zewnętrznym CSS.

Wady zewnętrznego CSS:

• Strony nie mogą zostać poprawnie dostarczone przed załadowaniem zewnętrznego CSS.
• W przypadku zewnętrznego CSS przesłanie wielu plików CSS może wydłużyć czas pobierania strony internetowej.

3. Wbudowany CSS

Wbudowany CSS służy do stylizowania określonego pliku HTML element. Dodać styl atrybutu do każdego znacznika HTML bez użycia selektorów. Zarządzanie stroną internetową może być trudne, jeśli tylko z niej korzystamy wbudowany CSS . Jednak Inline CSS w HTML jest przydatny w niektórych sytuacjach. Nie mamy dostępu do Pliki CSS lub zastosować style do elementu.

W poniższym przykładzie użyliśmy wbudowanego CSS w

polecenie cp w systemie Linux