Web-программирование, HTML/CSS

(Различия между версиями)
Перейти к: навигация, поиск
(21.20.2021)
Строка 15: Строка 15:
 
===21.20.2021===
 
===21.20.2021===
  
 +
====Формы (простой вариант)====
 
<source lang="html4strict">
 
<source lang="html4strict">
 
<html>
 
<html>
Строка 27: Строка 28:
 
             <input type="submit" value="Ага, согласен">
 
             <input type="submit" value="Ага, согласен">
 
         </form>
 
         </form>
 +
    </body>
 +
</html>
 +
</source>
 +
 +
====Формы (вариант посложнее)====
 +
<source lang="html4strict">
 +
<html>
 +
    <head>
 +
        <link rel="stylesheet" href="variables.css">
 +
        <title>
 +
            Forms (extra)
 +
        </title>
 +
    </head>
 +
    <body>
 +
        <form>
 +
            <div>
 +
                <p><input name="user_name" type="text" placeholder="User name"></p>
 +
                <p><input name="password" type="password" placeholder="password"></p>
 +
            </div>
 +
            <div>
 +
                Favorite color?
 +
                <input name="color" type="radio" value="white"> White
 +
                <input name="color" type="radio" value="black"> Black
 +
                <input name="color" type="radio" value="red"> Red
 +
                <input name="color" type="radio" value="blue"> Blue
 +
                <input name="color" type="radio" value="green"> Green
 +
            </div>
 +
            <div>
 +
                <input name="ocean" list="oceans" placeholder="Oceans">
 +
                <datalist id="oceans">
 +
                    <option value="Pacific">
 +
                    <option value="Indian">
 +
                    <option value="Atlantic">
 +
                    <option value="Arctic">
 +
                </datalist>
 +
            </div>
 +
 +
            <div>
 +
                <input type="checkbox" id="fav_oceans" name="fav_oceans" checked>
 +
                <label for="pacific">Pacific</label>
 +
            </div>
 +
            <div>
 +
                <input type="checkbox" id="fav_oceans" name="fav_oceans">
 +
                <label for="indian">Indian</label>
 +
            </div>
 +
            </div>
 +
            <div>
 +
                <input type="checkbox" id="fav_oceans" name="fav_oceans">
 +
                <label for="Arctic">Arctic</label>
 +
            </div>
 +
            <div>
 +
                <input type="checkbox" id="fav_oceans" name="fav_oceans" checked>
 +
                <label for="Atlantic">Atlantic</label>
 +
            </div>
 +
        </form>
 +
 
     </body>
 
     </body>
 
</html>
 
</html>
 
</source>
 
</source>

Версия 13:52, 22 октября 2021

Содержание

Какими программами пользоваться

Notepad++
VS Code


Материалы некоторых занятий

21.20.2021

Формы (простой вариант)

<html>
    <head>
        <title>Forms</title>
    </head>
    <body>
        <form>
            <input type="text"
           placeholder="Type here..."
           name="just_text">
            <input type="submit" value="Ага, согласен">
        </form>
    </body>
</html>

Формы (вариант посложнее)

<html>
    <head>
        <link rel="stylesheet" href="variables.css">
        <title>
            Forms (extra)
        </title>
    </head>
    <body>
        <form>
            <div>
                <p><input name="user_name" type="text" placeholder="User name"></p>
                <p><input name="password" type="password" placeholder="password"></p>
            </div>
            <div>
                Favorite color?
                <input name="color" type="radio" value="white"> White
                <input name="color" type="radio" value="black"> Black
                <input name="color" type="radio" value="red"> Red
                <input name="color" type="radio" value="blue"> Blue
                <input name="color" type="radio" value="green"> Green
            </div>
            <div>
                <input name="ocean" list="oceans" placeholder="Oceans">
                <datalist id="oceans">
                    <option value="Pacific">
                    <option value="Indian">
                    <option value="Atlantic">
                    <option value="Arctic">
                </datalist>
            </div>

            <div>
                <input type="checkbox" id="fav_oceans" name="fav_oceans" checked>
                <label for="pacific">Pacific</label>
            </div>
            <div>
                <input type="checkbox" id="fav_oceans" name="fav_oceans">
                <label for="indian">Indian</label>
            </div>
            </div>
            <div>
                <input type="checkbox" id="fav_oceans" name="fav_oceans">
                <label for="Arctic">Arctic</label>
            </div>
            <div>
                <input type="checkbox" id="fav_oceans" name="fav_oceans" checked>
                <label for="Atlantic">Atlantic</label>
            </div>
        </form>

    </body>
</html>
Личные инструменты
Пространства имён
Варианты
Действия
Навигация
Инструменты