wstawianie obrazka - Kurs HTML i CSS
Tło CSS / Tło obrazkowe {background-image}...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ć jako tło. Wpisanie "none" usunie obrazek. Ścieżkę dostępu należy konstruować względem...
Aktualizacja / System newsów...newsów (0 = zawsze) // Ustawienia domyślne: 'author': '', // autor 'email': '', // e-mail 'img': '', // obrazek 'width': '', // szerokość obrazka 'height': '', // wysokość obrazka 'target': '' // ramka (target="...") ////////// }; this.il_dni = typeof days != 'undefined' ? days : this.config['days']; var now = new Date(); var content = ''; this.dodaj = function(dzien,miesiac,rok, tytul,tresc, adres,ramka, dodal,email, obraz,width,height) { if (!this.il_dni...
- Oprawa graficzna / Zamiennik obrazkowy
...połączeń np. w przypadku telefonii komórkowej, może być sporym obciążeniem finansowym, a już na pewno znacząco wydłuży ładowanie strony. Statyczne wstawianie obrazków, tworzących oprawę graficzną, jest niepoprawne semantycznie. Każdy znacznik IMG obowiązkowo musi posiadać atrybut alt="...", który jest przydatny np. dla osób niewidomych. Jednak w takim przypadku będzie on kompletnie pozbawiony sensu, ponieważ nie ułatwia, tylko utrudnia odbiór treści. Syntezator mowy, używany przez osobę...
- Tło CSS / Powtarzanie tła obrazkowego {background-repeat}
...tła tylko w kierunku pionowym no-repeat - brak powtarzania tła (zostanie wyświetlone jako pojedynczy obrazek) space - przestrzeń pomiędzy obrazkami w tle zostanie dobrana w taki sposób, aby żadna grafika nie była przycięta (CSS 3) round - wymiary obrazka w tle zostaną dopasowane w taki sposób, aby żadna grafika nie była przycięta (CSS 3) Polecenie pozwala zdefiniować sposób powtarzania się obrazka w tle obrazkowym. Normalnie kopie obrazka są ustawiane obok siebie tak, że zajmują...
- Tło CSS / Rozmiary tła obrazkowego {background-size}
...względem obszaru pozycjonowania tła Podanie dwóch z powyższych wartości (np. "150px 100px") pozwala określić osobno szerokość i wysokość obrazka (skalowanie bez zachowania proporcji - rozciąganie grafiki). Aby przeskalować do wysokości, zachowując jego proporcje, jako szerokość należy podać wartość "auto" (np. "auto 100px"). Często zależy nam na wstawieniu w tle strony tylko jednego egzemplarza obrazka (bez jego powielania), ale w taki sposób aby idealnie dopasował się do...
- Obramowanie CSS / Obcięcie obramowania obrazkowego {border-image-slice}
...krawędzi i środka. Możliwe jest przy tym podanie: jednej wartości - określa jednakowe odległości cięć linii siatki od wszystkich krawędzi obrazka; jeżeli cała grafika będzie kwadratowa i jako obcięcie podamy wartość trzy razy mniejszą od długości boku obrazka, to uzyskamy siatkę w postaci dziewięciu równych kwadratów - jak na ściance kostki Rubika dwóch wartości - pierwsza określa odległości cięć linii siatki od górnej i od dolnej krawędzi, natomiast druga - od lewej i prawej...
- Tło CSS / Atrybuty mieszane tła {background}
...w zewnętrznym arkuszu stylów, a grafika zostanie dodana jako tło (bez powtarzania). Dodatkowo tekst będzie przesunięty w prawo, aby nie zasłaniał obrazka. Sposób taki ma tą zaletę, że w każdej chwili możemy usunąć obrazek lub zmienić jego pozycję, bez potrzeby modyfikacji każdej strony, na której występuje taki element. Ma to duże znaczenie, jeśli powtarza się on na wielu stronach. Niestety podczas drukowania strony, obrazek taki zostanie pominęty. Również jeśli przeglądarka nie...
- Obramowanie CSS / Powtarzanie obramowania obrazkowego {border-image-repeat}
...powielony na całej powierzchni round - powielenie z dopasowaniem rozmiarów (jeżeli długość krawędzi obramowania nie jest wielokrotnością wymiaru obrazka, zostanie on rozciągnięty w taki sposób, aby nie był przycięty) space - powielenie z dopasowaniem odstępów (jeżeli długość krawędzi obramowania nie jest wielokrotnością wymiaru obrazka, pusta przestrzeń pomiędzy sąsiednimi powtórzeniami obrazka zostanie dobrana w taki sposób, aby obrazek nie był przycięty) Przykład {border-image-repeat}...
Multimedia HTML / Obrazek HTML <img>...nie wczytają się (nawet jeśli na Twoim komputerze wszystko jest w porządku)! Edytory HTML posiadają często specjalny generator, który wspomaga wstawianie multimediów na strony WWW (nie tylko obrazków). Należy jednak pamiętać, że multimedia bardzo wyraźnie zwiększają objętość strony, a co za tym idzie, wydłużają czas wczytywania. Większość bardziej zaawansowanych programów graficznych udostępnia funkcję kompresji obrazów, co pozwala zmniejszyć ich objętość bez wyraźnego spadku jakości...
- Tło CSS / Pozycja tła obrazkowego {background-position}
...prawy-dolny róg dwie jednostki długości, z których pierwsza oznacza odległość od lewej krawędzi, a druga - od górnej Pozwala ustalić pozycję obrazka w tle. Polecenie to ma sens, tylko jeśli określimy równocześnie tło obrazkowe oraz ograniczymy jego powtarzanie (no-repeat, repeat-x lub repeat-y). Przykład {background-position} repeat-x; center repeat-y; center no-repeat; center no-repeat; top no-repeat; right top no-repeat; right no-repeat; right bottom no-repeat; bottom...