zdjęcie - Kurs HTML i CSS
HTML dla zielonych / Wstawienie obrazka HTML <img src alt>...Na przykład jeśli plik nazywa się "obrazek.jpg" i znajduje się w tym samym katalogu na dysku komputera co dokument *.html, w którym chcemy wstawić zdjęcie, można się posłużyć następującym znacznikiem: <img src="obrazek.jpg" alt="Tu wpisz krótki opis obrazka">. Tekst "Tu wpisz krótki opis obrazka" normalnie nie pojawi się na stronie, ale zaleca się go nie pomijać. Może on zostać pokazany, jeśli z jakiegoś powodu przeglądarka nie będzie mogła wyświetlić zdjęcia. Jest również przydatny osobom...
- HTML dla zielonych / Ustawienie obrazka HTML <img src alt "float">
...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 odpowiedniej wartości: <img src="obrazek.jpg" alt="Tu wpisz krótki opis obrazka" style="float: right">.
- Nagłówek i treść HTML / Roboty <meta "robots, googlebot">
...filmu z tym podglądem. Podanie wartości zero ("max-video-preview:0") oznacza, że w podglądzie będzie mogło się wyświetlić co najwyżej statyczne zdjęcie z filmu (atrybut poster="...") - zgodnie z ustawieniami dyrektywy "max-image-preview". Dyrektywa "noarchive" blokuje archiwizowanie dokumentu. Wyszukiwarki sieciowe często zapisują kopię indeksowanych stron w swojej pamięci podręcznej. Użytkownicy korzystający z wyszukiwarki mogą otworzyć taką kopię strony np. kiedy oryginalna witryna...
Szablon strony na DIV-ach / Stały szablon...elementy nawigacyjne itp.) zawsze pozostają ułożone dokładnie tak samo względem siebie. Inaczej mówiąc: jeśli np. w wybranym miejscu wstawimy zdjęcie oblane tekstem, to mamy pewność, że w każdej rozdzielczości ekranu efekt będzie taki sam, dzięki czemu unikniemy nieestetycznego ułożenia, gdy pod zdjęciem znalazłaby się tylko jedna linijka akapitu lub obok zdjęcia tylko jeden wyraz, co nie wszystkim się podoba. Mamy również pewność, że tytuły artykułów rozłożą się tak, jak to...
- Dobre praktyki / Przykazania webmastera
...tymi samymi plikami graficznymi co duże zdjęcia, a jedynie pomniejszone przy pomocy atrybutów width="..." oraz height="...". W ten sposób, mimo iż zdjęcie na stronie wygląda na małe, faktycznie będzie się wczytywać tak długo jak duże. Pomijając już fakt, że cała strona z listą takich "miniatur" będzie się ładować koszmarnie długo, to przecież użytkownik może nie być zainteresowany każdym zdjęciem, a tylko tymi, które później kliknie, aby je powiększyć. Po co zatem już na starcie ładować mu...
HTML dla zielonych / Ćwiczenia...można sobie swobodnie skopiować na swoją stronę, jeżeli autor nie wyraził na to zgody. Jeśli tworzysz stronę o sobie, może to być po prostu Twoje zdjęcie. Stwórz podstronę o nazwie linki.html (nowy plik HTML w edytorze) i umieść do niej odsyłacz na stronie głównej (czyli w pliku index.html). O tym co to są i jak się tworzy podstrony przeczytasz w podrozdziale: Ramy dokumentu. Na podstronie linki.html wstaw odsyłacze do ciekawych stron w internecie, na których czytelnik będzie mógł znaleźć...
- Obramowanie CSS / Atrybuty mieszane zaokrąglenia obramowania {border-radius}
(CSS 3 - interpretuje Internet Explorer 9, Firefox 4, Opera, Chrome) selektor { border-radius: wartości atrybutów } Selektorem może być dowolny znacznik, np. p - akapit czy h1 - tytuł [zobacz: Wstawianie stylów]. Natomiast jako "wartości atrybutów" należy wpisać kolejne wartości zaokrąglenia rozdzielone spacjami (w kolejności: górne-lewe, górne-prawe, dolne-prawe, dolne-lewe). Polecenie pozwala ustalić kilka wartości promieni zaokrąglenia jednocześnie. Możliwe jest przy tym podanie...
- Promocja strony WWW / Bannery i buttony
...produktu niż całego serwisu. Np. jeśli prowadzisz sklep internetowy, możesz przygotować reklamę kilku promocyjnych produktów, zawierającą ich nazwę, zdjęcie, cenę oraz przycisk "Kup" albo "Do koszyka", który od razu zachęci użytkownika do wykonania konkretnej akcji. Często dobre rezultaty dają bannery imitujące różnorakie kontrolki i okna dialogowe systemu Windows - np. przycisk OK, rozwijane menu, które zachęca do sprawdzenia co jest dalej albo pole z częściowo zakrytym tekstem i z widocznymi...
- HTML5 / Załącznik <figure, figcaption>
...diagramów i innych tego typu załączników w dokumentach HTML5. Jak dodać opis do zdjęcia HTML? Najlepszym sposobem dodania krótkiego opisu pod zdjęciem jest umieszczenie na stronie znacznika FIGURE, a wewnątrz niego IMG i FIGCAPTION. Na przykład jeśli plik zdjęcia nazywa się "zdjecie.jpg" i znajduje się w tym samym katalogu co dokument *.html, w którym chcemy go wstawić, można się posłużyć następującym kodem: <figure> <img src="zdjecie.jpg" alt="Tekst zastępczy"> <figcaption>Podpis...
- Obramowanie CSS / Atrybuty mieszane obramowania {border}
Spis treści {border} Atrybuty mieszane obramowania {border} Podkreślenie tekstu Zagnieżdżanie obramowania Atrybuty mieszane obramowania {border} Atrybuty mieszane górnego obramowania: selektor { border-top: wartości atrybutów } Atrybuty mieszane dolnego obramowania: selektor { border-bottom: wartości atrybutów } Atrybuty mieszane lewego obramowania: selektor { border-left: wartości atrybutów } Atrybuty mieszane prawego obramowania: selektor { border-right: wartości atrybutów }...