obrazkowe - Kurs HTML i CSS
Tło CSS / Tło obrazkowe {background-image}Spis treści {background-image} Tło obrazkowe {background-image} Wielokrotne tło obrazkowe Tło obrazkowe {background-image} (interpretuje Internet Explorer 6, Firefox, Opera, Chrome) selektor { background-image: url(ścieżka dostępu do obrazka) } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "ścieżka dostępu do obrazka" należy podać miejsce, gdzie znajduje się obrazek, który chcemy wstawić...
- Obramowanie CSS / Obramowanie obrazkowe {border-image-source}
...na niej estetycznie wyglądające ramki z graficznie wykończonymi krawędziami. W tradycyjnym podejściu zwykle przygotowuje się wtedy trzy elementy obrazkowe: górna krawędź ramki, dolna krawędź oraz boczne krawędzie w postaci grafiki powielanej w pionie. Przykład Tak wyglądają osobne części krawędzi obramowania (środkowy obrazek zostanie powielony w pionie, więc wystarczy, żeby miał wysokość 1px): Wykonanie ramki graficznej wymaga użycia następujące go kodu HTML: <div class="ramka">...
- Oprawa graficzna / Zamiennik obrazkowy
Spis treści Wstęp Fahrner Dwyer Phark Gilder/Levin Jefferies Zamienniki obrazkowe a Google Wstęp Po lekturze rozdziałów Menu w CSS oraz Szablon strony na DIV-ach powinny być Ci już znane ogromne możliwości wpływania na wygląd dokumentów stron WWW tylko za pomocą stylów CSS. Wiesz już, w jaki sposób można przygotować optymalny kod HTML, a następnie za pomocą w zasadzie drobnych wpisów w arkuszu CSS, wprowadzać daleko idące zmiany wyglądu witryny. Nie jest żadnym kłopotem zmiana...
- Tło CSS / Zaczepienie tła obrazkowego {background-attachment}
Spis treści {background-attachment} Zaczepienie tła obrazkowego {background-attachment} Wielokrotne zaczepienie Zaczepienie tła obrazkowego {background-attachment} (interpretuje Internet Explorer 9, Firefox, Opera, Chrome) selektor { background-attachment: zaczepienie } Jako "zaczepienie" należy wpisać: scroll - przewijanie tła (domyślnie) fixed - tło nieruchome względem okna przeglądarki local - tło nieruchome względem elementu (jeśli posiada on suwaki), ale przewijane względem...
- CSS dla zielonych / Tapeta CSS {background-color, background-image, color}
...konstruować względem lokalizacji pliku z arkuszem stylów, a nie względem adresu dokumentu HTML! kolor tekstu Definicja koloru tekstu strony Tło obrazkowe strony (tapeta) zawsze powinniśmy ustalać jednocześnie z kolorem tła oraz tekstu całej strony. Ponadto należy zadbać o odpowiedni kontrast pomiędzy tłem a kolorem tekstu, ponieważ w przeciwnym razie treść strony może się stać zupełnie nieczytelna. W praktyce oznacza to, że tapeta nie powinna być zbyt pstrokata ani zbyt jaskrawa, aby nie...
- Komendy CSS3 / Tło i obramowanie CSS
...Kolor tła Wartość <color> Inicjalizacja transparent Zastosowanie wszystkie elementy Dziedziczenie nie Procenty nie background-image Tło obrazkowe Wartość <bg-image> Inicjalizacja none Zastosowanie wszystkie elementy Dziedziczenie nie Procenty nie background-origin Pozycja początkowa tła Wartość <box> Inicjalizacja padding-box Zastosowanie wszystkie elementy Dziedziczenie nie Procenty nie background-position Pozycja tła Wartość <bg-position> Inicjalizacja 0% 0...
- Tło CSS / Usunięcie tła {background: none, background-color: transparent}
...że w zewnętrznym arkuszu stylów określamy ogólne własności dla wszystkich stron naszego serwisu. Załóżmy, że znajduje się tam m.in. deklaracja tła obrazkowego stron. Jeśli teraz zechcemy tylko na jednej ze stron zastosować zwykłe tło, a jednocześnie na innych pozostawić nadal obrazkowe, może to uczynić na dwa sposoby: Nie dołączać zewnętrznego arkusza do wybranej strony. Takie rozwiązanie nie jest jednak zbyt dobre, ponieważ musimy ręcznie wpisywać wszystkie inne deklaracje, które znajdują...
HTML dla zielonych / Odsyłacz obrazkowy HTML <a href, img src alt "border">...podaj tekst alternatywny" wpisuje się krótką informację, która pojawi się w przypadku, kiedy obrazek nie zostanie wyświetlony. Jak widać odsyłacza obrazkowego możemy użyć w połączeniu z dowolnym typem odnośników (do podstrony, do adresu internetowego lub pocztowy). Jednak najczęściej w ten sposób tworzy się menu nawigacyjne serwisu (odsyłacze do podstron). Obrazki przycisków najlepiej zapisywać w formacie GIF. Jeśli nie masz zacięcia artystycznego, nie musisz samodzielnie rysować wszystkich...
Odsyłacze HTML / Ćwiczenia...ilustrację, a nigdy nie powiększaj miniaturki. Podmień ilustracje na stronie na ich wersje pomniejszone. Następnie przekształć je w odsyłacze obrazkowe i podlinkuj do pełnowymiarowych wersji zdjęć. Użyj przy tym atrybutu target="_blank", który otworzy zdjęcie w nowym oknie (nowej karcie przeglądarki). Nie musisz w tym celu tworzyć żadnych nowych podstron. Wystarczy że jako odnośnika użyjesz po prostu lokalizacji pliku z dużym zdjęciem. Otwórz stronę w przeglądarce internetowej i spróbuj...
- Komendy CSS 2 / background-image
WARTOŚĆ <adres> | none | inherit OPIS Tło obrazkowe INICJALIZACJA none ZASTOSOWANIE wszystkie elementy DZIEDZICZENIE nie PROCENTY nie MEDIA visual