Jak ukryć obrazy cyfrowe na stronach internetowych
Kaskadowe arkusze stylów mogą pomóc zaoszczędzić czas przy utrzymywaniu stron w witrynie. Obrazy cyfrowe na przykład prawdopodobnie pojawiają się na niektórych stronach internetowych. Jeśli kiedykolwiek będziesz musiał uniemożliwić oglądanie tych obrazów, możesz użyć CSS, aby ukryć obrazy, zmieniając jedno słowo w dokumencie HTML. Możesz nawet ponownie wyświetlić obrazy, dokonując szybkiej aktualizacji kodu CSS swojego dokumentu.
1.
Otwórz dokument HTML zawierający co najmniej jeden obraz i znajdź sekcję treści dokumentu. Tagi obrazów sekcji ciała będą wyglądać podobnie do przedstawionego poniżej:
Podstawowy tag obrazu zaczynający się od słowa "img". Tag w tym przykładzie odnosi się do obrazu o nazwie "img / setting-up-new-business / 167 / how-hide-digital-images-web-pages-2.jpg."
2.
Zmień jeden ze swoich tagów graficznych tak, aby odwoływał się do klasy CSS o nazwie "widoczność", jak pokazano w następującym przykładzie:
Jeśli tag ma już odwołanie do klasy, musisz zmienić tag w nieco inny sposób. Załóżmy, że Twój tag wygląda tak, jak pokazano poniżej:
Ten tag obrazu już odwołuje się do klasy o nazwie "myclass". Jeśli twój tag img odwołuje się już do klasy, tak jak to robi, dodaj "widoczność" po nazwie klasy, jak widać poniżej:
3.
Wklej następujące elementy do sekcji head twojego dokumentu:
Tworzy to klasę widoczności i ustawia wartość atrybutu wyświetlania na "blokuj". Ta wartość powoduje, że obrazy są widoczne.
4.
Zapisz dokument i otwórz go w dowolnej przeglądarce. Twoje zdjęcia będą wyglądać normalnie.
5.
Wróć do edytora i znajdź kod CSS dodany do sekcji head dokumentu. Zmień wartość atrybutu wyświetlania z "blok" na "brak" i zapisz dokument.
6.
Wróć do przeglądarki i naciśnij "Ctrl-F5", aby wyczyścić pamięć tymczasową. Po odświeżeniu strony zdjęcia znikną.
Wskazówki
- Dodaj odwołanie do klasy do każdego obrazu, który chcesz ukryć. Nazwij swoją klasę CSS, co tylko chcesz. Jego nazwa to "widoczność" w tym przykładzie.
- Spraw, aby Twoje obrazy były znów widoczne, zmieniając słowo "none" na "block".