Ramka z HTML - jak to działa
Aby media w Twojej witrynie były bardziej atrakcyjne, możesz użyć kodu HTML, aby narysować wokół niego ramkę. W tej praktycznej wskazówce pokażemy, jak to działa i jakie zalety oferują kaskadowe arkusze stylów (CSS) podczas definiowania ramki.
Kodowanie HTML - rysuj ramki wokół obrazów i innych mediów
Domyślnie każdy obraz ma ramkę o szerokości jednego piksela. Jest to jednak widoczne tylko wtedy, gdy obraz jest używany jako hiperłącze. Za pomocą atrybutu „border” możesz indywidualnie zdefiniować grubość ramki.
- W HTML kod dziesięciopikselowej czarnej ramki wygląda mniej więcej tak:
- Ta ramka jest stosowana do wszystkich czterech stron obiektu.
- Alternatywnie możesz użyć programu do edycji obrazów, takiego jak Gimp, aby narysować ramkę wokół obrazu.
- Pamiętaj jednak, że spowoduje to powiększenie obrazu i pobranie go przez użytkownika odwiedzającego Twoją witrynę potrwa dłużej.
![](http://hackzl.com/img/internet/9377/rahmen-mit-html-gehts.webp)
Zdefiniuj ramkę w dokumencie HTML za pomocą CSS
Możesz zdefiniować ramkę - na przykład ramkę wokół tekstu - z kaskadowymi arkuszami stylów jeszcze dokładniej.
- Kolejna praktyczna wskazówka pokazuje, jak zintegrować plik CSS z witryną.
- W tym dokumencie CSS możesz ustawić kolor i grubość ramki inaczej dla wszystkich czterech stron:
- border-bottom: # 999 - Ustawia kolor dolnej ramki. Tutaj możesz także użyć „border-top”, „border-right” lub „border-left”.
- border-width: 0 0 cienki cienki - określa grubość linii. Odbywa się to zgodnie z ruchem wskazówek zegara. Oznacza to, że nie widać żadnych linii u góry i po prawej stronie, a cienką linię u dołu i po lewej stronie.
- border-style: none none groove groove - Określa dekoracyjną ramkę do zdjęcia lub pudełka. Styl „groove” tworzy efekt 3D.
![](http://hackzl.com/img/internet/9377/rahmen-mit-html-gehts-2.webp)
Twoja strona główna naturalnie żyje z obecności w sieci. W następnym artykule przeczytasz najlepsze wskazówki, jak poprawić swój ranking Google.