MyTetra Share
Делитесь знаниями!
Обучение_HTML
Время создания: 16.02.2021 10:33
Текстовые метки: Обучение_HTML
Раздел: M_RUSAKOV_Teacher
Запись: alensav/MyTetra2/main/base/16134608040iu9a16j2d/text.html на raw.githubusercontent.com

Обучение_HTML

1.Уроки. Page

2.Page2

<header>Шапка сайта</header>

<iframe width="560" height="315" src="page3.html" title="page3.html"></iframe>

<!--Вывод youtube на сайт в режиме встраивания-->

<iframe width="560" height="315" src="https://www.youtube.com/embed/NWgwNA4t5T0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen>

Ваш браузер не поддерживает фреймы


</iframe>

3.Page3

<header>градиентная заливка/header>

<p><a href="index.html">Возврат на главную страницу</a></p>

<div class="lg"></div>

<div class="lg_2"></div>

<div class="lg_3"></div>

<div class="rg"></div>


4.Page4<body>

<div class="block"></div>

<div class="block_1"></div>

<!--Трансформации-->

<div class="t_1"></div>


</body>

5.

6 Page6

.<body>

<p>Способы подключения CSS</p>

<p>Новые подключения CSS с помощью style</p>

<p>Способы подключения CSS с помощью импорта</p>

<p style="font-style: italic;">Новые подключения CSS стил Inline</p>

7. Page7

body>

<!--http://allfont.ru-->

<!--Конвертор шрифтов https://onlinefontconverter.com-->

<h1>Заголовок необычным шрифтом</h1>

<p>Другие дизайнерские штуки</p>

<p class="shadow">Текст с тенью</p>

<p>База с уникальными идентификаторами организаций (OUI) обычно уже присутствует в системах Linux, поскольку её используют различные программы. Вы можете поискать этот файл: 1 locate oui.txt Также вы можете скачать эту базу 1 wget http://standards-oui.ieee.org/oui/oui.txt

База представляет собой обычный текстовый файл, по которому мы можете искать различными удобными вам способами. mv oui.txt.1 oui.txt</p>

<a href="#">Переход на главную</a>


</body>


</body>

8.Page8

<body>

<h1>Абсолютные и относительные измерения</h1>

<!--in=25.4 mm, 1pt = 1/72in-->

<p class="mm">Измеренияа20mm;</p>

<p class="cm">Измерения-2cm;</p>

<p class="in">Измерения-2in;</p>

<p class="pt">Измерения-12pt;</p>

<h2>Относительные величины</h2>

<p class="px">Измеренияа20px;</p>

<p class="em">Измерения-2em;</p>

<p class="percent">Измерения-200%;</p>

<!--При адаптации под мобильные программы-->

<!--/*Размер от ширины экрана -->

<p class="vw">Измерения-2vw;</p>

<!--/*Размер от высоты экрана -->

<p class="vh">Измерения-2vh;</p>



</body>

9.Page9

<body>

<h1 id="title">

Заголовок

</title>

</h1>

<p>селекторы</p>

<p class="red">селекторы</p>

<p>селекторы: "<span>контексный- зеленый</span>". </p>


<form name="form" action="#" method="post">

<p>Заголовок формы</p>

<div>

<input type="text" name="name" />

</div>

<div>

<input type="submit" name="name" />

</div>

</form>

<ul>

<li>1</li>

<li>2</li>

<li>3</li>

<li>4</li>


</ul>

<table>

<tr>

<td>1</td>

<td>2</td>

<td>3</td>

<td>4</td>

</tr>

<tr>

<td>5</td>

<td>6</td>

<td>7</td>

<td>8</td>

</tr>

</table>

<p>

<a href="#">ССЫЛКА_ИЗМЕНЕНИЕ_ЦВЕТА</a>

</p>

10.Page10 , в тчю СКРОЛЛИНГ

<body>

<h1>CSS в отношении блоков</h1>

<div id="container">

<p>Текст внутри блока</p>

<p>Текст внутри блока</p>

<p>Текст внутри блока</p>

<a href="#">ссылка</a>


</div>

<div class="div_1">

11

<div class="div_2">

22


</div>


</div>

<div class="over">

<p>Тут много текста Тут много текста Тут много текста Тут много текста </p>


</div>

========================================


CSS свойство overflow

Пример 

#wrap1
{
overflow:visible;
}
#wrap2
{
overflow:hidden;
}
#wrap3
{
overflow:scroll;
}
#wrap4
{
overflow:auto;
}

Попробовать в редакторе

Быстрый просмотр

Описание

С помощью свойства overflow Вы можете указать как должно отображаться содержимое вышедшее за пределы элемента.

Возможные значения

Значение

Описание

auto

Если содержимое выйдет за пределы элемента к нему автоматически будет добавлена полоса прокрутки, пролистав которую можно будет увидеть вышедшее за пределы содержимое.

visible

Содержимое вышедшее за пределы элемента будет отображаться. Является значением по умолчанию.

hidden

Содержимое вышедшее за пределы элемента будет скрыто.

scroll

У элемента будет присутствовать полоса прокрутки, пролистав которую можно увидеть вышедшее за пределы содержимое (отличается от auto тем, что полосы прокрутки всегда отображаются независимо от того имеет ли элемент вышедшее за пределы содержимое или нет).

=========================================


<p>Текст за пределами div</p>


</body>

11.

12. Page12

<body>

<h1>ФОН</h1>

<div class="red"></div>


<div class="image_blue"></div>

<div class="bg_sizen"></div>

<div class="bg_mult"></div>

</body>

13. Page13

<body>

<h1>ГРАДИЕНТНАЯ РАСКРАСКА</h1>

<div class="lg"></div>

<div class="lg2"></div>

<div class="rg"></div>



</body>

14.

Page14

<body>

<h1>ПОЗИЦИОНИРОВАНИЕ БЛОКОВ</h1>

<div>

<img src="./font/index.jpeg" alt="картинка" </div>
 
MyTetra Share v.0.64
Яндекс индекс цитирования