JAK

Jak Domů

Menu

Lišta ikon Ikona nabídky Akordeon Karty Vertikální záložky Záhlaví karet Karty celé stránky Karty po najetí myší Horní Navigace Responzivní Topnav Navbar s ikonami Nabídka vyhledávání Panel vyhledávání Pevný boční panel Navigace na stránce Responzivní postranní panel Navigace na celou obrazovku Nabídka mimo plátno Umístění tlačítek boční navigace Postranní panel s ikonami Horizontální rolovací menu Vertikální nabídka Spodní navigace Responzivní spodní navigace Spodní okraj navigačních odkazů Odkazy nabídky zarovnané vpravo Odkaz na střed nabídky Odkazy na nabídku stejné šířky Pevné menu Posuňte lištu dolů při posouvání Skrýt navigační panel při posouvání Shrink Navbar on Scroll Sticky Navbar Navbar na obrázku Rozbalovací nabídky po najetí myší Klikněte na Rozbalovací seznamy Kaskádový rozevírací seznam Rozbalovací nabídka v Topnav Rozbalovací seznam v Sidenav Resp Rozbalovací nabídka Navbar Nabídka subnavigace Dropup Mega Menu Mobilní menu Nabídka záclon Sbalený postranní panel Složený boční panel Stránkování Strouhanka Skupina tlačítek Skupina vertikálních tlačítek Sticky Social Bar Pilulková navigace Responzivní záhlaví

snímky

Prezentace Prezentace Galerie Modální obrázky Světelný box Responzivní mřížka obrázků Obrazová mřížka Galerie karet Vyblednutí překryvného obrázku Překryvný snímek Překryvný obrázek Zoom Název překryvného obrázku Ikona překrytí obrázku Obrazové efekty Černobílý obrázek Text obrázku Obrazové textové bloky Text průhledného obrázku Obrázek celé stránky Formulář na obrázku Obrázek hrdiny Rozostření Obrázek na pozadí Změnit Bg on Scroll Obrazy vedle sebe Zaoblené obrázky Obrázky avatarů Responzivní obrázky Středové obrázky Miniatury Ohraničení kolem obrázku Seznamte se s týmem Lepivý obrázek Překlopte obrázek Zatřeste obrázkem Portfolio galerie Portfolio s filtrováním Přiblížení obrázku Skleněná lupa Posuvník pro srovnání obrázků Favicon

Tlačítka

Tlačítka výstrah Tlačítka obrysu Rozdělit tlačítka Animovaná tlačítka blednoucí tlačítka Tlačítko na obrázku Tlačítka sociálních médií Číst více Číst méně Tlačítka načítání Tlačítka ke stažení Tlačítka na pilulky Tlačítko oznámení Ikonová tlačítka Tlačítka Další/Předchozí Více Tlačítko v Nav Blokovat tlačítka Textová tlačítka kulatá tlačítka Tlačítko Posunout Nahoru

formuláře

přihlašovací formulář Přihlašovací formulář Pokladní formulář Kontaktní formulář Přihlašovací formulář pro sociální sítě Registrační formulář Formulář s ikonami Zpravodaj Skládaný formulář Responzivní formulář Popup Form Inline formulář Vymazat vstupní pole Skrýt číselné šipky Kopírovat text do schránky Animované vyhledávání Tlačítko Hledat Celoobrazovkové vyhledávání Vstupní pole v navigační liště Přihlašovací formulář v Navbar Vlastní zaškrtávací políčko/rádio Vlastní výběr Přepnout spínač Zaškrtněte políčko Detekce Caps Lock Spouštěcí tlačítko na Enter Ověření hesla Přepnout viditelnost hesla Vícekrokový formulář Automatické doplňování Vypněte automatické doplňování Vypněte kontrolu pravopisu Tlačítko pro nahrání souboru Ověření prázdného vstupu

Filtry

Seznam filtrů Tabulka filtrů Filtrační prvky Rozbalovací nabídka filtrů Seznam řazení Tabulka kouzel

Tabulky

Zebra pruhovaný stůl Středové stoly Stůl na celou šířku Stoly vedle sebe Responzivní tabulky Srovnávací tabulka

Více

Video na celou obrazovku Modální boxy Smazat modal Časová osa Ukazatel rolování Progress Bars Skill Bar Posuvníky rozsahu Popisky Zobrazovací prvek Přejetí myší Vyskakovací okna Skládací Kalendář HTML zahrnuje Seznam úkolů Nakladače Hodnocení hvězdičkami Uživatelské hodnocení Překryvný efekt Kontaktujte čipy karty Otočit kartu Karta profilu Produktová karta Upozornění Zavolat Poznámky Štítky Kruhy Styl HR Kupón Seznam skupiny Seznam bez odrážek Responzivní text Text výřezu Zářící Text Pevné zápatí Lepivý prvek Stejná výška Clearfix Responzivní plováky Snackbar Celoobrazovkové okno Scroll Drawing Plynulé posouvání Přechod Bg Scroll Sticky Header Zmenšit záhlaví při posouvání Tabulka cen Paralaxa Poměr stran Responzivní prvky iframe Přepínání Líbí se/Nelíbí Přepnout Skrýt/Zobrazit Přepnout tmavý režim Přepnout text Přepnout třídu Přidat třídu Odebrat třídu Aktivní třída Stromový pohled Odebrat službu Detekce offline Najděte skrytý prvek Přesměrování webové stránky Zoom Umístěte ukazatel myši Flip Box Střed Svisle Středové tlačítko v DIV Přechod na Hover Šipky Tvary Odkaz ke stažení Prvek plné výšky Okno prohlížeče Vlastní posuvník Skrýt posuvník Zobrazit/Vynutit posuvník Vzhled zařízení Upravitelné ohraničení Barva zástupného symbolu Barva výběru textu Barva odrážky Svislá čára Děliče Animovat ikony Odpočítávadlo Psací stroj Již brzy Stránka Chatové zprávy Vyskakovací okno chatu Rozdělená obrazovka Posudky Počítadlo sekcí Prezentace citací Uzavíratelné položky seznamu Typické body přerušení zařízení Přetahovatelný prvek HTML JS Media dotazy Zvýrazňovač syntaxe JS animace Délka řetězce JS Umocnění JS Výchozí parametry JS Získat aktuální URL Získejte aktuální velikost obrazovky Získejte prvky iframe

webová stránka

Vytvořte si web zdarma Vytvořte web Vytvořte statický web Vytvořit web (W3.CSS) Vytvořte web (BS3) Vytvořte web (BS4) Vytvořte web (BS5) Vytvořit a zobrazit web Vytvořte web se stromem odkazů Vytvořte portfolio Vytvořte životopis Vytvořte web restaurace Vytvořte obchodní web Vytvořte si webovou knihu Web centra Kontaktní sekce O stránce Velké záhlaví Příklad webové stránky

Mřížka

2 Rozvržení sloupců 3 Rozvržení sloupců 4 Rozvržení sloupců Rozšiřující se mřížka Zobrazení mřížky seznamu Smíšené rozvržení sloupců Karty sloupců Rozložení Zig Zag Rozvržení blogu

Google

Google Charts Písma Google Párování písem Google Google nastavit Analytics

Převodníky

Převést váhu Převést teplotu Převést délku Převést rychlost

Blog

Získejte pozici vývojáře Staňte se předním vývojářem.

Jak na to – Vytvořte si web zdarma


Vytvořte a hostujte své webové stránky pomocí W3Schools Spaces.

Začněte se svými bezplatnými webovými stránkami několika kliknutími.

Vše, co potřebujete, přímo v prohlížeči.

Snadno se používá – vyzkoušejte!

Začněte zdarma »

Vytvořte si svůj první web pomocí W3Schools Spaces

W3Schools Spaces je osobní místo, kde můžete vytvářet a experimentovat s kódem a hostovat své vlastní webové stránky.

S W3Schools Spaces můžete vytvářet pomocí HTML, CSS a JavaScriptu.

Upravte kód přímo ve svém prohlížeči.

Nahrajte a hostujte své soubory a obrázky.

Začněte rozvíjet svou online přítomnost ještě dnes!


Proč stavět pomocí W3Schools Spaces?

Prostory vytvářejí weboví vývojáři pro webové vývojáře.

  1. Rozhraní je jednoduché a snadno se používá.
  2. Hostujte a upravujte své soubory přímo v prohlížeči.
  3. Šablony zdarma.

Začít je zdarma a nemusíte zadávat svou kreditní kartu.


Upravit a zobrazit náhled kódu

Editor se snadno používá – což vám pomůže soustředit se na nejdůležitější věci.

Zkontrolujte odezvu svého webu pomocí různých alternativ náhledu.

Náhled změn na vašem webu, živě!


Stavět odkudkoli

Hostujte své soubory a obrázky v cloudu.

Udržujte si pořádek vytvořením struktury se složkami.

Vše, co potřebujete, přímo v prohlížeči.


Šablony zdarma

Procházejte a používejte naše responzivní šablony webových stránek.

Upravujte je, ukládejte, sdílejte a používejte je ve svých projektech.

The templates are powered by W3.CSS


What Do I Need to Know to Get Started?

HTML, CSS and JavaScript are the foundational languages to build a website.

  1. Create the structure with HTML. The first thing you have to learn, is HTML, which is the standard markup language for creating web pages.
  2. Learn HTML »
  3. Style with CSS. The next step is to learn CSS, to set the layout of your web page with beautiful colors, fonts, and much more.
  4. Learn CSS »
  5. Make it interactive with JavaScript. After studying HTML and CSS, you should learn JavaScript to create dynamic and interactive web pages for your users.
  6. Learn JavaScript »

Do not worry if you do not know how to code. The most important thing is to get hands on, early on. Learning how to code is best done with getting practical. Start to build something today!


Lets Get Started in a Few Steps

Do you already have a W3Schools Account? If so, skip the first step


Step One: Sign Up For an Account

To be able to use Spaces you need to sign up and get your account.

Lets get you set up!

Go to - Click "Sign up" and enter your email and password, then click the "Sign up for free" button.

Remember to validate your account in your email. Check the spam filter if you cannot find the validation email in your inbox.

Get more information about how to sign up in our article - How to sign up


Step Two: Start with a template or HTML skeleton

Go to

Select one of the options and click the "Continue" button.

Do not worry too much about this decision. You can reset your Space and start over again whenever you want.


Step Three: Give your space a name

Personalize your Space by giving it an amazing name.

You can not use special letters in the name, such as (#, ! or :). The only exception is dash ( - )

The name will be the link that you share with others to see your site. For example: yourname.w3spaces.com


Step Four: Enter your space

Great job! you made it to the dashboard.

In the dashboard you get an overview of your spaces and usage.

Enter your space and its File Overview by clicking somewhere on the space's row or click the button with the three dots to the right inside the row.

You can only have one space with the free plan. However, you can always upgrade to get more spaces.


Step Five: Edit code or upload files

This is where the magic happens!

Start to edit code or upload files

  • Edit code by clicking on the "Pen icon" to the right of the file that you want to edit.
  • Create new files by clicking on the "New file" button.
  • Upload files by clicking on the "Upload files" button.

Step Six: Publish your site and share it with someone

This is the start of building your online presence.

Learn, test, build, and go live with your space.

Create your website and share it with others.

Note: Your space name with the .w3spaces.com extension is your shareable link. Read more about how to share your space in this article How can I share my space?


W3Schools Spaces

W3Schools Spaces

Build your own website with W3Schools Spaces.

Get Started for Free