Multimedia: dodawanie filmów i dźwięku
Osadzanie filmów i plików dźwiękowych na stronie internetowej
Multimedia: dodawanie filmów i dźwięku to bezpłatna lekcja HTML for Kids na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej HTML for Kids, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs HTML for Kids zawiera 4 lekcji w sumie.
Style wbudowane: dodawanie prostych stylów do HTML
Witamy w świecie stylizacji! Dziś nauczymy się używać stylów wbudowanych do zmiany wyglądu elementów na stronie internetowej. Style wbudowane to prosty i szybki sposób na poprawienie wyglądu strony.
Czym są style wbudowane?
Style wbudowane umożliwiają bezpośrednie zastosowanie CSS (Cascading Style Sheets) do elementu HTML za pomocą atrybutu style.
Przykład:
<h1 style="color: red;">Hello, World!</h1>
Spowoduje to wyświetlenie czerwonego nagłówka. Przyjrzyjmy się, jak to działa!
Zmiana koloru tekstu
Kolor tekstu można zmienić za pomocą właściwości color w atrybucie style.
Przykład:
<p style="color: blue;">This is blue text.</p>
Zmiana rozmiaru czcionki
Aby zmienić rozmiar tekstu, użyj właściwości font-size.
Przykład:
<p style="font-size: 20px;">This text is 20 pixels large.</p>Dodawanie koloru tła
Kolor tła elementu można dodać za pomocą właściwości background-color.
Przykład:
<p style="background-color: yellow;">This text has a yellow background.</p>Łączenie wielu stylów
Można łączyć wiele stylów, oddzielając je średnikiem ;.
Przykład:
<p style="color: white; background-color: black; font-size: 18px;">
This text has multiple styles applied!
</p>Stylizowanie innych elementów
Style wbudowane działają na wszystkich elementach HTML, takich jak nagłówki, akapity i przyciski.
Przykład:
<h1 style="color: green;">Styled Heading</h1>
<button style="background-color: lightblue; border: none; padding: 10px;">
Styled Button
</button>Spróbuj samodzielnie
Utwórzmy stronę internetową ze stylami inline. Oto przykład:
<!DOCTYPE html>
<html>
<head>
<title>Inline Styles Example</title>
</head>
<body>
<h1 style="color: purple;">Welcome to My Styled Page</h1>
<p style="color: gray; font-size: 16px;">
This paragraph has styled text.
</p>
<button style="background-color: coral; color: white; padding: 10px;">
Click Me!
</button>
</body>
</html>
Świetna praca!
Gratulacje! Nauczyłeś się, jak używać stylów inline do dodawania prostych i skutecznych stylów do stron internetowych. Style inline świetnie nadają się do szybkich zmian, ale stylowanie oferuje znacznie więcej! W następnej lekcji omówimy podstawy CSS, aby odkryć pełny potencjał projektowania stron internetowych. Przygotuj się do tworzenia efektownych stron internetowych!

Często zadawane pytania
Czy lekcja „Multimedia: dodawanie filmów i dźwięku” jest bezpłatna?
Tak — pełny tekst „Multimedia: dodawanie filmów i dźwięku” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu HTML for Kids, przejdź na CoddyKit PRO. Kurs HTML for Kids zawiera 4 lekcji w sumie.
Co nauczysz się w „Multimedia: dodawanie filmów i dźwięku”?
Osadzanie filmów i plików dźwiękowych na stronie internetowej Ćwiczysz HTML for Kids z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć HTML for Kids?
Nie wymagamy żadnego doświadczenia. HTML for Kids w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.
Ile czasu zajmuje lekcja „Multimedia: dodawanie filmów i dźwięku”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji HTML for Kids?
Tak. Każda lekcja HTML for Kids zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- Tabele: organizowanie danych
- Formularze: zbieranie danych od użytkownika
- Atrybuty HTML
- Multimedia: dodawanie filmów i dźwięku