Step 5 (S-44726)

From Stepik Wiki
Revision as of 23:29, 5 August 2017 by Admin (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Step on Stepik: https://stepik.org/lesson/14820/step/5

Step 5 (S-44726) 1.png

[00:00 - 00:17] помимо строчных обычных тегов присутствует более сложной конструкции которой состоят не из 1 из группы тегов к таким в частности относится списки и таблицы а присутствует возможность


Step 5 (S-44726) 2.png

[00:17 - 00:36] дорожать стандартный для текстовых редакторов нумерованные и маркированные списки для этого используется а 3 тэга для маркированных маркированных списков используется юл для


[00:36 - 00:53] нумерованных слово ордера упорядоченный список и а для боях используются т л и в качестве а выделение 1 элемента лист а


[00:53 - 01:12] пример очень простой а каким образом я на 1 из предыдущих слайдов сделал а список а строковых строковых так я создал а т к и л а


[01:12 - 01:29] и внутри него добавил до каждого интересующего меня элементы этого списка list item title i внутри тэга может находиться а произвольная что мы в принципе туда можно вставлять переносы строк а застать вас будет


[01:29 - 01:46] неупорядоченный список маркированный список элементами которого являются произвольную с моей конструкции а здесь все довольно просто а помимо списков что мы есть а также таблицы


[01:46 - 02:05] таблица этот более сложной конструкции здесь используется большое количество тегов а основными из них являются теги table table за контейнер в котором содержится вся таблица


[02:05 - 02:23] тр тр это table row 1 строчка таблице и тд тд это 1 ячейка внутри 1 строки таблицы а слева


[02:23 - 02:39] указан более полный пример здесь использованы всевозможные тэги которая молодости таблица в частности в таблице может быть отдельно названия название таблицы создается деревом тегов caption


[02:39 - 02:56] хотя в принципе есть возможность разместить название вне таблица с помощью отдельной верстки но тем не менее а сдается с помощью так а в таблице выделяются заголовок


[02:56 - 03:13] верхнюю строчку и тела таблице все остальные строчки соответственно таки to have и to body а внутри ты все таки body содержится строки то есть тр внутри а каждой строки могут содержаться


[03:13 - 03:32] ячейки td а либо специальные ячейки которые подсвечиваются и мы подсвечиваются цветом либо выделенное жирным шрифтом аш это ячейке заголовков


[03:32 - 03:50] структура общем то такова а действительно необходимыми являются только t the table tr td а в частности так можно вообще убрать не использовать а можно не писать браузер его автоматически достроят


[03:50 - 04:08] это общая особенность а что мы браузера а стараются обработать можно больше ошибок и частично достраивают некоторые конструкции за а мася а давайте посмотрим какие есть какие есть атрибуты


[04:08 - 04:23] а у самой таблице довольно много атрибутов в принципе они из атрибутов создает расположение таблице например атрибут бортом


[04:23 - 04:39] а говорит о том что таблицы должны быть а не за что мы должны видеть а рамке таблица а интереснее для нас атрибуты которые могут быть а ячеек td


[04:39 - 04:56] у них может быть 2 атрибута кол спам и роуз а эти атрибуты позволяют а объединять 2 ячейки в 1 либо несколько ячеек в 1 так как это делается например или


[04:56 - 05:14] в целях например если указывать calls равняется 2 это означает что данный человека будет занимать а вместо 2 то есть объединяется с соседней а по по строке то есть вы объединяете 2 ячейки в 1 строке


[05:14 - 05:30] если вы указываете равный 2 вы объединяете 2 ячейки а в 1 столбце то есть по идее а вот видите на с 1 строка


[05:30 - 05:48] узнал 2 строка а в 1 строке у нас а 3 ищейки а во 2 указана только 2 это потому что 1 ячейка из 1 строчки она займет 2 по вертикали


[05:48 - 06:07] а проще всего посмотреть как это выглядит в уже отрисован виде а водка то есть визуально никак не выделяется а вот у нас ячейку у которой заданы 2


Step 5 (S-44726) 3.png

[06:07 - 06:23] вот она занимает а 2 колонки вот и чей то у которой указана росспэн


[06:23 - 06:38] она занимает 2 строки то что видите а это лечить у нее есть выделение то есть и в жирная то потому что это ячейка t аш


[06:38 - 06:58] остальные ячейки у нас тд а вот в принципе основной функционал таблицы некоторое время назад таблице в что мы использовали для задания структуры страницы


[06:58 - 07:14] то есть если вы делаете допустим трехколоночный сайт был соблазн сделать а с основную структуру построить на таблица состоящая из 1 строки и 3 ячеек это так называемая табличная верстка


[07:14 - 07:29] а такой подход применялся раньше но сейчас он крайне не рекомендуется а в современном современных сайтов таблица используется именно по назначению для отображения табличных данных каких то списков и отчетов