{"id":38,"date":"2026-04-22T00:57:53","date_gmt":"2026-04-21T22:57:53","guid":{"rendered":"https:\/\/student062.akademiata.edu.pl\/?page_id=38"},"modified":"2026-04-22T01:35:05","modified_gmt":"2026-04-21T23:35:05","slug":"strona-glowna","status":"publish","type":"page","link":"https:\/\/student062.akademiata.edu.pl\/","title":{"rendered":"Strona glowna"},"content":{"rendered":"\n<div class=\"wp-block-group alignfull is-layout-flow wp-block-group-is-layout-flow\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n\n<div id=\"ppsi-root\" style=\"font-family:'Segoe UI',system-ui,sans-serif;color:#1a1a2e;background:#f8f9ff;line-height:1.7;width:100%;max-width:100%;box-sizing:border-box;\">\n\n<header style=\"background:linear-gradient(135deg,#0f3460 0%,#16213e 50%,#0f3460 100%);color:white;padding:0;position:relative;overflow:hidden;\">\n  <div style=\"position:relative;z-index:1;padding:60px 40px 50px;text-align:center;\">\n    <div style=\"margin:0 auto 16px;font-size:36px;width:70px;height:70px;border-radius:16px;background:rgba(255,255,255,0.1);display:flex;align-items:center;justify-content:center;\">\ud83c\udf10<\/div>\n    <h1 style=\"font-size:clamp(26px,4vw,48px);font-weight:800;letter-spacing:-1px;margin-bottom:12px;background:linear-gradient(90deg,#e94560,#f5a623,#00d2ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;\">Podstawy Programowania Stron Internetowych<\/h1>\n    <p style=\"font-size:17px;color:rgba(255,255,255,0.75);max-width:600px;margin:0 auto 24px;\">Kompendium wiedzy: HTML, CSS, JavaScript i nowoczesne technologie webowe<\/p>\n    <div style=\"display:flex;gap:10px;justify-content:center;flex-wrap:wrap;\">\n      <span style=\"display:inline-block;padding:5px 14px;border-radius:50px;font-size:12px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;background:rgba(0,210,255,0.2);color:#00d2ff;border:1px solid rgba(0,210,255,0.4);\">HTML5<\/span>\n      <span style=\"display:inline-block;padding:5px 14px;border-radius:50px;font-size:12px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;background:rgba(233,69,96,0.2);color:#e94560;border:1px solid rgba(233,69,96,0.4);\">CSS3<\/span>\n      <span style=\"display:inline-block;padding:5px 14px;border-radius:50px;font-size:12px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;background:rgba(245,166,35,0.2);color:#f5a623;border:1px solid rgba(245,166,35,0.4);\">JavaScript<\/span>\n      <span style=\"display:inline-block;padding:5px 14px;border-radius:50px;font-size:12px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;background:rgba(233,69,96,0.2);color:#e94560;border:1px solid rgba(233,69,96,0.4);\">WordPress<\/span>\n    <\/div>\n  <\/div>\n<\/header>\n\n<style>\n.ppsi-nav-item:hover .ppsi-dropdown { display:block !important; }\n.ppsi-nav-link:hover { color:#e94560 !important; }\n.ppsi-nav-item:hover .ppsi-darr { transform:rotate(180deg); }\n.ppsi-dropdown a:hover { background:rgba(233,69,96,0.15) !important; color:#e94560 !important; }\n<\/style>\n\n<main style=\"max-width:1200px;margin:0 auto;padding:40px 20px;\">\n\n  <section id=\"sec-media\" style=\"background:white;border-radius:16px;padding:36px;margin-bottom:32px;box-shadow:0 2px 16px rgba(15,52,96,0.08);border:1px solid rgba(15,52,96,0.07);\">\n    <h2 style=\"font-size:22px;font-weight:700;color:#0f3460;margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid #f0f2f8;display:flex;align-items:center;gap:10px;\">\n      <span style=\"width:32px;height:32px;background:linear-gradient(135deg,#e94560,#f5a623);border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;\">\ud83d\uddbc\ufe0f<\/span>\n      Wizualne elementy stron internetowych\n    <\/h2>\n\n    <div style=\"display:grid;grid-template-columns:1fr 1fr;gap:16px;\">\n      <div style=\"border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(15,52,96,0.1);\">\n        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1461749280684-dccba630e2f6?w=600&#038;q=80\" alt=\"Programowanie \u2014 kod na ekranie monitora\" style=\"width:100%;display:block;aspect-ratio:16\/9;object-fit:cover;\" loading=\"lazy\"\/>\n        <div style=\"padding:10px 14px;background:white;font-size:12px;color:#8892b0;border-top:1px solid #f0f2f8;\">\ud83d\udcbb Praca z kodem HTML\/CSS\/JS<\/div>\n      <\/div>\n      <div style=\"border-radius:12px;overflow:hidden;box-shadow:0 4px 16px rgba(15,52,96,0.1);\">\n        <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1498050108023-c5249f4df085?w=600&#038;q=80\" alt=\"Laptop z otwartym edytorem kodu\" style=\"width:100%;display:block;aspect-ratio:16\/9;object-fit:cover;\" loading=\"lazy\"\/>\n        <div style=\"padding:10px 14px;background:white;font-size:12px;color:#8892b0;border-top:1px solid #f0f2f8;\">\ud83c\udfa8 Projektowanie interfejs\u00f3w u\u017cytkownika<\/div>\n      <\/div>\n    <\/div>\n\n    <h3 style=\"font-size:16px;font-weight:600;color:#2d3748;margin:28px 0 12px;\">Animowany GIF \u2014 przyk\u0142ad<\/h3>\n    <div style=\"text-align:center;\">\n      <img decoding=\"async\" src=\"https:\/\/media.giphy.com\/media\/ZVik7pBtu9dNS\/giphy.gif\" alt=\"Animacja \u2014 programowanie i kod\" style=\"max-width:480px;width:100%;border-radius:12px;box-shadow:0 4px 20px rgba(15,52,96,0.15);\"\/>\n      <p style=\"font-size:13px;color:#8892b0;margin-top:8px;\">\u2191 Animowany GIF \u2014 podstawowy element multimedialny strony<\/p>\n    <\/div>\n  <\/section>\n\n  <section style=\"background:white;border-radius:16px;padding:36px;margin-bottom:32px;box-shadow:0 2px 16px rgba(15,52,96,0.08);border:1px solid rgba(15,52,96,0.07);\">\n    <h2 style=\"font-size:22px;font-weight:700;color:#0f3460;margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid #f0f2f8;display:flex;align-items:center;gap:10px;\">\n      <span style=\"width:32px;height:32px;background:linear-gradient(135deg,#e94560,#f5a623);border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;\">\u25b6\ufe0f<\/span>\n      Wideo \u2014 HTML w praktyce\n    <\/h2>\n    <p style=\"margin-bottom:16px;color:#4a5568;\">Wideo jest kluczowym elementem nowoczesnych stron internetowych. Poni\u017cej fragment kursu HTML5 z platformy YouTube.<\/p>\n    <div style=\"position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:12px;box-shadow:0 4px 20px rgba(15,52,96,0.15);\">\n      <iframe src=\"https:\/\/www.youtube.com\/embed\/opNgrPv3Qw8\" title=\"HTML Tutorial for Beginners\" frameborder=\"0\" allow=\"accelerometer;autoplay;clipboard-write;encrypted-media;gyroscope;picture-in-picture\" allowfullscreen style=\"position:absolute;top:0;left:0;width:100%;height:100%;\"><\/iframe>\n    <\/div>\n    <p style=\"font-size:12px;color:#8892b0;margin-top:10px;\">\u0179r\u00f3d\u0142o: YouTube \u2014 kurs HTML dla pocz\u0105tkuj\u0105cych<\/p>\n  <\/section>\n\n  <section id=\"sec-typografia\" style=\"background:white;border-radius:16px;padding:36px;margin-bottom:32px;box-shadow:0 2px 16px rgba(15,52,96,0.08);border:1px solid rgba(15,52,96,0.07);\">\n    <h2 style=\"font-size:22px;font-weight:700;color:#0f3460;margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid #f0f2f8;display:flex;align-items:center;gap:10px;\">\n      <span style=\"width:32px;height:32px;background:linear-gradient(135deg,#e94560,#f5a623);border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;flex-shrink:0;\">Aa<\/span>\n      Typografia i style \u2014 HTML\/CSS\n    <\/h2>\n\n    <div style=\"font-size:36px;font-weight:800;color:#0f3460;margin-bottom:10px;\">H1 \u2014 Nag\u0142\u00f3wek pierwszego poziomu<\/div>\n    <div style=\"font-size:28px;font-weight:700;color:#1a4a8a;margin-bottom:10px;\">H2 \u2014 Nag\u0142\u00f3wek drugiego poziomu<\/div>\n    <div style=\"font-size:22px;font-weight:600;color:#e94560;margin-bottom:10px;\">H3 \u2014 Nag\u0142\u00f3wek trzeciego poziomu<\/div>\n    <div style=\"font-size:18px;font-weight:600;color:#2d3748;margin-bottom:16px;\">H4 \u2014 Nag\u0142\u00f3wek czwartego poziomu<\/div>\n\n    <p style=\"font-size:18px;color:#4a5568;line-height:1.8;margin-bottom:14px;\">Lead paragraph \u2014 wst\u0119pny akapit wyr\u00f3\u017cniony wi\u0119ksz\u0105 czcionk\u0105, przyci\u0105gaj\u0105cy uwag\u0119 czytelnika.<\/p>\n\n    <p style=\"color:#4a5568;margin-bottom:14px;\">Zwyk\u0142y akapit z <strong style=\"font-weight:700;color:#0f3460;\">pogrubionym tekstem<\/strong>, <em style=\"font-style:italic;color:#4a5568;\">pochylonym tekstem<\/em>, <span style=\"background:#fff3cd;padding:1px 4px;border-radius:3px;\">zaznaczonym fragmentem<\/span>, <span style=\"text-decoration:line-through;color:#8892b0;\">przekre\u015blonym tekstem<\/span> oraz <span style=\"text-decoration:underline;text-decoration-color:#e94560;\">podkre\u015blonym tekstem<\/span>.<\/p>\n\n    <blockquote style=\"border-left:4px solid #e94560;padding:12px 20px;background:#fff5f7;border-radius:0 8px 8px 0;font-style:italic;color:#4a5568;margin:16px 0;\">\n      \u201eKa\u017cda strona internetowa sk\u0142ada si\u0119 z trzech warstw: tre\u015bci (HTML), wygl\u0105du (CSS) i interakcji (JavaScript). Opanowanie tych trzech technologii to fundament web developmentu.&#8221;\n    <\/blockquote>\n\n    <div style=\"background:#1e2a45;border-radius:10px;overflow-x:auto;margin-top:20px;\">\n      <div style=\"display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:rgba(255,255,255,0.05);border-bottom:1px solid rgba(255,255,255,0.1);\">\n        <div style=\"display:flex;gap:6px;\">\n          <div style=\"width:12px;height:12px;border-radius:50%;background:#e94560;\"><\/div>\n          <div style=\"width:12px;height:12px;border-radius:50%;background:#f5a623;\"><\/div>\n          <div style=\"width:12px;height:12px;border-radius:50%;background:#1a7a40;\"><\/div>\n        <\/div>\n        <span style=\"font-size:11px;color:rgba(255,255,255,0.4);font-family:monospace;text-transform:uppercase;\">HTML<\/span>\n      <\/div>\n      <pre style=\"padding:20px;font-size:13px;line-height:1.7;color:#a8b2d8;font-family:Consolas,'Courier New',monospace;margin:0;overflow-x:auto;\"><span style=\"color:#5a6a8a;\">&lt;!-- Przyk\u0142ad struktury strony HTML5 --&gt;<\/span>\n<span style=\"color:#f5a623;\">&lt;!DOCTYPE html&gt;<\/span>\n<span style=\"color:#f5a623;\">&lt;html<\/span> <span style=\"color:#e94560;\">lang<\/span>=<span style=\"color:#a8ff78;\">\"pl\"<\/span><span style=\"color:#f5a623;\">&gt;<\/span>\n<span style=\"color:#f5a623;\">&lt;head&gt;<\/span>\n  <span style=\"color:#f5a623;\">&lt;meta<\/span> <span style=\"color:#e94560;\">charset<\/span>=<span style=\"color:#a8ff78;\">\"UTF-8\"<\/span><span style=\"color:#f5a623;\">&gt;<\/span>\n  <span style=\"color:#f5a623;\">&lt;title&gt;<\/span>Moja strona<span style=\"color:#f5a623;\">&lt;\/title&gt;<\/span>\n<span style=\"color:#f5a623;\">&lt;\/head&gt;<\/span>\n<span style=\"color:#f5a623;\">&lt;body&gt;<\/span>\n  <span style=\"color:#f5a623;\">&lt;h1&gt;<\/span>Witaj na mojej stronie!<span style=\"color:#f5a623;\">&lt;\/h1&gt;<\/span>\n  <span style=\"color:#f5a623;\">&lt;p&gt;<\/span>Tu jest tre\u015b\u0107...<span style=\"color:#f5a623;\">&lt;\/p&gt;<\/span>\n<span style=\"color:#f5a623;\">&lt;\/body&gt;<\/span>\n<span style=\"color:#f5a623;\">&lt;\/html&gt;<\/span><\/pre>\n    <\/div>\n  <\/section>\n\n  <section id=\"sec-tabela\" style=\"background:white;border-radius:16px;padding:36px;margin-bottom:32px;box-shadow:0 2px 16px rgba(15,52,96,0.08);border:1px solid rgba(15,52,96,0.07);\">\n    <h2 style=\"font-size:22px;font-weight:700;color:#0f3460;margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid #f0f2f8;display:flex;align-items:center;gap:10px;\">\n      <span style=\"width:32px;height:32px;background:linear-gradient(135deg,#e94560,#f5a623);border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;\">\ud83d\udcca<\/span>\n      Tabela sortowalna \u2014 technologie webowe\n    <\/h2>\n    <p style=\"color:#4a5568;margin-bottom:14px;\">Kliknij nag\u0142\u00f3wek kolumny, aby posortowa\u0107. U\u017cyj wyszukiwarki, aby filtrowa\u0107.<\/p>\n\n    <input id=\"ppsi-search\" type=\"text\" placeholder=\"\ud83d\udd0d Szukaj technologii...\" oninput=\"ppsiFilter()\" style=\"padding:8px 14px;border:1.5px solid #dde3f5;border-radius:8px;font-size:14px;outline:none;min-width:200px;margin-bottom:14px;width:100%;max-width:340px;box-sizing:border-box;\"\/>\n\n    <div style=\"overflow-x:auto;\">\n      <table id=\"ppsi-table\" style=\"width:100%;border-collapse:collapse;font-size:14px;\">\n        <thead>\n          <tr>\n            <th onclick=\"ppsiSort(0)\" style=\"background:#0f3460;color:white;padding:12px 16px;text-align:left;cursor:pointer;user-select:none;white-space:nowrap;\">Technologia <span id=\"s0\">\u21c5<\/span><\/th>\n            <th onclick=\"ppsiSort(1)\" style=\"background:#0f3460;color:white;padding:12px 16px;text-align:left;cursor:pointer;user-select:none;\">Typ <span id=\"s1\">\u21c5<\/span><\/th>\n            <th onclick=\"ppsiSort(2)\" style=\"background:#0f3460;color:white;padding:12px 16px;text-align:left;cursor:pointer;user-select:none;\">Rok <span id=\"s2\">\u21c5<\/span><\/th>\n            <th onclick=\"ppsiSort(3)\" style=\"background:#0f3460;color:white;padding:12px 16px;text-align:left;cursor:pointer;user-select:none;\">Popularno\u015b\u0107 % <span id=\"s3\">\u21c5<\/span><\/th>\n            <th onclick=\"ppsiSort(4)\" style=\"background:#0f3460;color:white;padding:12px 16px;text-align:left;cursor:pointer;user-select:none;\">Trudno\u015b\u0107 <span id=\"s4\">\u21c5<\/span><\/th>\n          <\/tr>\n        <\/thead>\n        <tbody id=\"ppsi-tbody\">\n          <tr><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><strong>HTML5<\/strong><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#e6f0ff;color:#1a5fc8;\">Markup<\/span><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">2014<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">98<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#e6f7ed;color:#1a7a40;\">\u0141atwy<\/span><\/td><\/tr>\n          <tr style=\"background:#f8f9ff;\"><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><strong>CSS3<\/strong><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#e6f0ff;color:#1a5fc8;\">Styling<\/span><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">2011<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">97<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#e6f7ed;color:#1a7a40;\">\u0141atwy<\/span><\/td><\/tr>\n          <tr><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><strong>JavaScript<\/strong><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#fff0f2;color:#c81a3a;\">Scripting<\/span><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">1995<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">98<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#fff0f2;color:#c81a3a;\">\u015aredni<\/span><\/td><\/tr>\n          <tr style=\"background:#f8f9ff;\"><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><strong>React<\/strong><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#fff0f2;color:#c81a3a;\">Framework<\/span><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">2013<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">82<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#fff0f2;color:#c81a3a;\">\u015aredni<\/span><\/td><\/tr>\n          <tr><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><strong>Bootstrap<\/strong><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#e6f0ff;color:#1a5fc8;\">CSS Framework<\/span><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">2011<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">76<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#e6f7ed;color:#1a7a40;\">\u0141atwy<\/span><\/td><\/tr>\n          <tr style=\"background:#f8f9ff;\"><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><strong>WordPress<\/strong><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#e6f0ff;color:#1a5fc8;\">CMS<\/span><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">2003<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">64<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#e6f7ed;color:#1a7a40;\">\u0141atwy<\/span><\/td><\/tr>\n          <tr><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><strong>PHP<\/strong><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#fff0f2;color:#c81a3a;\">Backend<\/span><\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">1994<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\">77<\/td><td style=\"padding:11px 16px;border-bottom:1px solid #f0f2f8;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#fff0f2;color:#c81a3a;\">\u015aredni<\/span><\/td><\/tr>\n          <tr style=\"background:#f8f9ff;\"><td style=\"padding:11px 16px;\"><strong>Node.js<\/strong><\/td><td style=\"padding:11px 16px;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#fff0f2;color:#c81a3a;\">Runtime<\/span><\/td><td style=\"padding:11px 16px;\">2009<\/td><td style=\"padding:11px 16px;\">66<\/td><td style=\"padding:11px 16px;\"><span style=\"display:inline-block;padding:2px 10px;border-radius:50px;font-size:11px;font-weight:600;background:#fff0f2;color:#c81a3a;\">\u015aredni<\/span><\/td><\/tr>\n        <\/tbody>\n      <\/table>\n    <\/div>\n    <p id=\"ppsi-count\" style=\"font-size:12px;color:#8892b0;margin-top:8px;\">Wy\u015bwietlono 8 wierszy<\/p>\n  <\/section>\n<\/main>\n\n<footer style=\"background:linear-gradient(135deg,#0f3460,#16213e);color:white;padding:30px 40px;margin-top:20px;text-align:center;\">\n  <a href=\"#ppsi-root\" style=\"display:inline-block;padding:10px 24px;border-radius:8px;background:#e94560;color:white;text-decoration:none;font-weight:600;font-size:14px;margin-bottom:16px;\">\u2191 Powr\u00f3t do g\u00f3ry<\/a>\n  <p style=\"font-size:13px;color:rgba(255,255,255,0.4);margin:0;\">\u00a9 2026 Podstawy Programowania Stron Internetowych<\/p>\n<\/footer>\n\n<div id=\"ppsi-toasts\" style=\"position:fixed;bottom:24px;right:24px;z-index:99999;display:flex;flex-direction:column;gap:8px;\"><\/div>\n\n<\/div>\n\n\n<script>\nvar ppsiDir=[true,true,true,true,true];\nfunction ppsiSort(col){\n  var tb=document.getElementById('ppsi-tbody');\n  var rows=Array.from(tb.querySelectorAll('tr'));\n  for(var i=0;i<5;i++)document.getElementById('s'+i).textContent='\u21c5';\n  rows.sort(function(a,b){\n    var va=a.cells[col].textContent.trim(),vb=b.cells[col].textContent.trim();\n    var na=parseFloat(va),nb=parseFloat(vb);\n    if(!isNaN(na)&#038;&#038;!isNaN(nb))return ppsiDir[col]?na-nb:nb-na;\n    return ppsiDir[col]?va.localeCompare(vb,'pl'):vb.localeCompare(va,'pl');\n  });\n  document.getElementById('s'+col).textContent=ppsiDir[col]?'\u25b2':'\u25bc';\n  ppsiDir[col]=!ppsiDir[col];\n  rows.forEach(function(r){tb.appendChild(r);});\n}\nfunction ppsiFilter(){\n  var q=document.getElementById('ppsi-search').value.toLowerCase();\n  var rows=document.querySelectorAll('#ppsi-tbody tr');\n  var v=0;\n  rows.forEach(function(r){var s=r.textContent.toLowerCase().includes(q);r.style.display=s?'':'none';if(s)v++;});\n  document.getElementById('ppsi-count').textContent='Wy\u015bwietlono '+v+' wierszy';\n}();\n<\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>\ud83c\udf10 Podstawy Programowania Stron Internetowych Kompendium wiedzy: HTML, CSS, JavaScript i nowoczesne technologie webowe HTML5 CSS3 JavaScript WordPress \ud83d\uddbc\ufe0f Wizualne elementy stron internetowych \ud83d\udcbb Praca z kodem HTML\/CSS\/JS \ud83c\udfa8 Projektowanie interfejs\u00f3w u\u017cytkownika Animowany GIF \u2014 przyk\u0142ad \u2191 Animowany GIF \u2014 podstawowy element multimedialny strony \u25b6\ufe0f Wideo \u2014 HTML w praktyce Wideo jest kluczowym elementem nowoczesnych [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-38","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/student062.akademiata.edu.pl\/index.php\/wp-json\/wp\/v2\/pages\/38","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/student062.akademiata.edu.pl\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/student062.akademiata.edu.pl\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/student062.akademiata.edu.pl\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/student062.akademiata.edu.pl\/index.php\/wp-json\/wp\/v2\/comments?post=38"}],"version-history":[{"count":8,"href":"https:\/\/student062.akademiata.edu.pl\/index.php\/wp-json\/wp\/v2\/pages\/38\/revisions"}],"predecessor-version":[{"id":69,"href":"https:\/\/student062.akademiata.edu.pl\/index.php\/wp-json\/wp\/v2\/pages\/38\/revisions\/69"}],"wp:attachment":[{"href":"https:\/\/student062.akademiata.edu.pl\/index.php\/wp-json\/wp\/v2\/media?parent=38"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}