Jak ustawić obrazek jako tło w CSS? - Kurs HTML i CSS

• 
  Tło CSS / Tło obrazkowe {background-image}

  ...akapit z tłem obrazkowym. Zwróć uwagę, że pod tłem pierwszoplanowym ułożony jest drugi obrazek... Pytania i odpowiedzi {background-image} Jak ustawić obrazek jako tło w CSS? Aby ustawić obrazek jako tło w CSS, można użyć właściwości background-image i podać ścieżkę dostępu do obrazka jako wartość. Na przykład: "background-image: url('sciezka/do/obrazka.jpg')". Jak dodać tło do zdjęcia? Aby dodać tło do zdjęcia z elementami przezroczystymi w CSS, można jednocześnie użyć...

• 
  Multimedia HTML / Obrazek HTML <img>

  ...można w tym celu użyć formatu GIF (lub PNG). Obszary, które mają być niewidoczne, należy narysować innym kolorem, a następnie w programie graficznym ustawić ten kolor jako przezroczysty (transparent). Uwaga: format JPG (oraz BMP) nie obsługuje przezroczystości! Podobny efekt można co prawda uzyskać, rysując "niewidoczne" części kolorem tła strony WWW. Jednak jeśli zmienimy kolor tła na stronie, będzie trzeba zmienić również wszystkie takie obrazki. Natomiast jeżeli ustalimy przezroczystość na...

• 
  HTML dla zielonych / Ustawienie obrazka HTML <img src alt "float">

  ...right", style="float: right", style="float: right"... Pytania i odpowiedzi <img src alt "float"> Jak przesunąć obrazek w lewo HTML? Aby ustawić obrazek po lewej stronie tekstu, należy dodać do jego znacznika atrybut o odpowiedniej wartości: <img src="obrazek.jpg" alt="Tu wpisz krótki opis obrazka" style="float: left">. Jak wstawić zdjęcie po prawej stronie w HTML? Aby w języku HTML ustawić obrazek po prawej stronie tekstu, należy dodać do jego znacznika atrybut o...

• 
  Oprawa graficzna / "Duszki" CSS

  ...stratna co prawa powoduje utratę jakości, ale jest to słabo zauważalne dla przeciętnego człowieka, a zyski są ogromne. Stopień kompresji można ustawić najczęściej podczas zapisu pliku w dowolnym, bardziej rozbudowanym programie graficznym. Naprawdę warto poeksperymentować! BMP Nigdy nie używaj na stronach internetowych formatu BMP (ang. bitmap), ponieważ nie zapewnia on dobrej kompresji, a więc pliki w nim zapisane są ogromne! GIF Do wszelkiego rodzaju ręcznie rysowanych ikon...

• 
  Aktualizacja / System newsów

  ...this.wyswietl = function() { if (content) document.write('<dl class="news">' + content + '</dl>'); } } Na początku można ustawić zmienne konfiguracyjne. Np. aby w naszym serwisie nie "straszyły" kilkumiesięczne "nowości", można ustawić przez ile dni od ich wprowadzenia mają się wyświetlać na liście. Potem co jakiś czas można czyścić kod z przestarzałych nowości, które już się nie wyświetlają. Jeżeli wszystkie lub większość newsów będzie dodawała ta sama osoba, można...

• 
  HTML dla zielonych / Wyśrodkowanie obrazka HTML <div "center", img src alt>

  ...wpisuje się krótką informację, która pojawi się w przypadku, kiedy obrazek nie zostanie wyświetlony. Polecenie pozwala wyśrodkować obrazek, czyli ustawić go na środku ekranu. Dla zainteresowanych Jeśli chcesz dowiedzieć się więcej na temat dodatkowych możliwości przy wstawianiu obrazków na stronach internetowych, zobacz rozdział: Multimedia / Obrazek. Przykład <div "center", img src alt> Pytania i odpowiedzi <div "center", img src alt> Jak wycentrować zdjęcie HTML? Najłatwiejszym...

• 
  CSS dla zielonych / Tapeta CSS {background-color, background-image, color}

  ...i odpowiedzi {background-color, background-image, color, background-attachment, background-position, background-repeat, background-size} Jak ustawić obrazek jako tło w CSS? W tym celu najlepiej w arkuszu stylów do selektora właściwego ciała dokumentu dodać deklaracje o odpowiednich wartościach. Na przykład jeśli plik tła nazywa się "obrazek.jpg" i znajduje się w tym samym katalogu na dysku komputera co arkusz stylów *.css, a jego kolorystyka jest przeważająco jasna, można się...

• 
  Rozmiary CSS / Szerokość i marginesy automatyczne

  ...Z powyższego równania wynika w szczególności, że dwa bloki z oblewaniem, bez ustalonej szerokości lub z ustaloną wartością width: auto, mogą się ustawić obok siebie, o ile tekst i inne elementy w nich zawarte będą na tyle krótkie, że zmieszczą się w jednej linii bez potrzeby przełamywania wierszy. Właściwość ta jest często wykorzystywana przy tworzeniu struktury strony w oparciu o CSS, np. do ustawienia obok siebie linków zgromadzonych w wykazie, aby utworzyć efekt zakładek nawigacyjnych...

• 
  Kursory CSS / Kursor obrazkowy {cursor: url}

  ...podanie pozycji zawsze za pomocą dwóch współrzędnych). Przykład {cursor: url} Wskaż ten tekst myszką Pytania i odpowiedzi {cursor: url} Jak ustawić dowolny kursor? Aby ustawić dowolny kursor, użyj właściwości cursor w CSS i określ odpowiednią wartość kursora. Możesz również użyć niestandardowego obrazka jako kursora za pomocą url('ścieżka/do/obrazka.png'). Na przykład: element { cursor: url('myszka.png'), auto } ustawi niestandardowy obrazek jako kursor, który zmieni się na domyślny...

• 
  Nagłówek i treść HTML / Ikona strony <link "shortcut icon">

  ...znajduje się pod adresem https://www.example.com/, to adres pliku ikony powinien być następujący: https://www.example.com/favicon.ico. Jak ustawić ikonę w HTML? Aby ustawić ikonę strony, która została zapisana w pliku favicon.ico, należy umieścić w nagłówku dokumentu - tzn. gdziekolwiek wewnątrz elementu <head>...</head> - następujący znacznik: <link rel="shortcut icon" href="/favicon.ico">. Trzeba jednak przy tym pamiętać, że w pliku *.html może się znajdować tylko jeden nagłówek...

1 2 »