Jak korzystać z znacznika <SPAN> w HTML?
Znacznik <span> dość często jest nie doceniany przez osoby, które dopiero zaczynają naukę HTML i CSS. Jest tak dlatego, że nie zdają sobie one sprawy z jego potencjału.
HTML i CSS to podstawowe technologie wykorzystywane do budowania i formatowania stron internetowych. HTML odpowiada za strukturę i znaczenie elementów strony, natomiast CSS pozwala określać ich wygląd, rozmieszczenie oraz zachowanie w różnych sytuacjach.
W tej kategorii znajdziesz poradniki i przykłady kodu, które pomogą Ci poznać te technologie i wykorzystać je w praktyce. Omawiam między innymi znaczniki HTML, selektory i właściwości CSS, formatowanie tekstu, listy, tabele, formularze, menu nawigacyjne oraz efekty wizualne.
Materiały mogą być przydatne osobom rozpoczynającym naukę tworzenia stron WWW, a także tym, którzy znają już podstawy i chcą przypomnieć sobie konkretne rozwiązania lub znaleźć sposób na wykonanie wybranego elementu strony.
Jeśli wolisz uczyć się według uporządkowanego planu, zajrzyj również na stronę kursu HTML i CSS, gdzie znajdziesz materiały pogrupowane według zagadnień.
Prosta galeria slider z jQuery
Dziś pokażę wam jak w prosty sposób zbudować ciekawy slider – galerię (baner) zdjęć składającą się z 5 zdjęć. Zdjęcia będą zaś pokazywać się po kliknięciu w przycisk – czyli interakcji z użytkownikiem.
![Przykładowe pola formularza [HTML]](https://aurainweb.pl/wp-content/uploads/2022/04/form-przyklady-pola-min.jpg)
Przykładowe pola formularza [HTML]
Jeszcze kilka lat temu by dany formularz posiadał jakąś funkcjonalność musieliśmy często dodać ją np. poprzez walidację w JS.
Zmiana wyglądu pól formularza HTML z pomocą CSS
Wygląd pól formularza HTML podobnie jak w przypadku innych elementów HTML można zmieniać z pomocą CSS. Aby tego jednak dokonać trzeba poznać kilka właściwości, które nam to umożliwią.
![Wysokość elementu, sekcji na wysokość okna przeglądarki [CSS]](https://aurainweb.pl/wp-content/uploads/2019/07/comp5.jpg)
Wysokość elementu, sekcji na wysokość okna przeglądarki [CSS]
W tym wpisie pokażę wam jak w prosty sposób ustawić wysokość elementu blokowego takiego jak <div> czy <section> na wysokość okna przeglądarki. Czyli na całą widoczną część strony – 100% wysokości.
![Budujemy prostą galerię obrazów masonry na stronę internetową [CSS]](https://aurainweb.pl/wp-content/uploads/2019/12/masonery-t1.jpg)
Budujemy prostą galerię obrazów masonry na stronę internetową [CSS]
Dzisiaj zbudujemy bardzo prostą galerię obrazów w stylu masonry (pionowe) z pomocą CSS. No dobrze, ale z pewnością część z was zastanawia się co to jest te masonry. W języku angielskim słowo to oznacza kamieniarstwo, murarstwo.
Frameworki CSS – czy warto z nich korzystać?
Głównym zadaniem frameworków CSS jest przyspieszenie i ustandaryzowanie pracy twórców różnego typu stron internetowych. Jednak jak zawsze tak i w tej kwestii zdania są podzielone.
![Jak używać @media query? Kilka przydatnych przykładów. [CSS3]](https://aurainweb.pl/wp-content/uploads/2019/10/mobile-1.jpg)
Jak używać @media query? Kilka przydatnych przykładów. [CSS3]
Media query to bardzo użyteczna „zmienna”, „zapytanie” wprowadzone w CSS3. Prawidłowo użyta umożliwia dostosowanie wyglądu strony w zależności od np. szerokości ekranu, rodzaju urządzenia. Z tego powodu spotykana jest ona na każdej stronie typu RWD.
![Jak osiągnąć efekt skośnego tła na stronie? [CSS]](https://aurainweb.pl/wp-content/uploads/2019/10/office-16.jpg)
Jak osiągnąć efekt skośnego tła na stronie? [CSS]
Od razu przyznam się, że kiedy pierwszy raz zobaczyłam skośne tło na stronie internetowej to myślałam, że ktoś obrócił tło strony. To była moja pierwsza myśl i jak się kazało błędna.
Cień na stronie z CSS3 – box-shadow, text-shadow
Czasami w celu uzyskania ciekawego efektu na stronie chcemy dodać umieszczonym na niej obiektom (obrazom, tekstowi lub np. <DIV>, <button>) jak by dodatkowy wymiar.
PHTML – co to za format plików?
Pliki z rozszerzeniem .PHTML są to najczęściej pliki HTML zawierające wstawki w kodzie PHP.
Efekt pisania tekstu na stronie internetowej – animacje CSS
Dzisiaj wracam do tematyki animacji jakich można użyć na stronie internetowej. Do tej pory pokazałam takie dość klasyczne animacje głównie na obrazkach i grafikach. Tym razem na swój warsztat wezmę więc tekst.