Назначение элементов header, nav, article, aside, footer

Контрольные вопросы
Назначение элементов header, nav, article, aside, footer
Назначение элемента meta
Что такое кодировка?
Зачем нужны символьные подстановки?
Отличие линейных и блочных тегов
Отличие физического и логического форматирования
Основные форматы изображений для браузеров
Как сделать маркированный / нумерованный список?
Как сделать многоуровневый список?
Основные стили списков и их элементов

Таблицы
Табличное представление информации используется в тех случаях, когда необходимо вывести на страницу большое количество данных, характеризуемых однотипным набором данных. Примерами таких данных могут быть список фильмов, или каталог товаров Citrus/Rozetka/OLX.
Таблицы строятся с помощью элементов следующих типов:
table - собственно контейнер, содержащий таблицу. По стандарту, этот элемент может содержать только элементы группировки строк (thead, tfoot и tbody).
tbody - тело таблицы. Внутри этого элемента должны размещаться только строки таблицы.
tr - служит для создания строк таблицы. В строке могут размещаться элементы данных таблицы (td) или элементы заголовка (th)
td - элемент данных таблицы
th - элемент заголовка таблицы

Пример кода

Результат
Как вы сами можете убедиться, полученная таблица выглядит не совсем так, как хотелось бы. У привычных нам таблиц есть по крайней мере рамки! Добиться "нормального" внешнего вида нам помогут атрибуты элемента table:
∙ border - данный атрибут определяет наличие и толщину рамки таблицы. Если border имеет значение больше 0, то таблица, а так же каждая ее непустая ячейка, приобретет рамку. Кроме того, толщина внешней рамки таблицы определяется присвоенным значением.
∙ width - ширина всей таблицы. При этом, ширина каждого столбца таблицы подбирается автоматически на основании длины значений ячеек, составляющих данный столбец. Ширину таблицы можно указывать в пикселях или в процентах. В последнем случае сразу после числа ставится знак "%".
∙ cellspacing - размер внешнего отступа от границ ячеек до соседних ячеек или рамки таблицы.
∙ cellpadding - размер внутреннего отступа от границ ячеек до содержимого.
Слайд 6
Добавляем шапку
Слайд 7
Выравнивание данных
Выравнивать данные таблицы можно для каждой конкретной ячейки, для всей строки
и для группы строк или столбцов (
, , ). Кроме того, данные можно выравнивать по горизонтали и вертикали. Для горизонтального выравнивания используется атрибут align, который может принимать следующие значения:
∙ left - по левой стороне ячейки
∙ center - по правой стороне ячейки
∙ right - по центру ячейки
∙ justify - по ширине ячейки.
Для вертикальоного выравнивания используется атрибут valign. Значения этого атрибута могут быть следующими:
∙ top - по верху ячейки
∙ middle - по центру ячейки
∙ bottom - по низу ячейки.
Для какого бы элемента вы ни указали атрибуты align или valign ( или группе), выравнивание происходит относительно границ каждой ячейки. Указав выравнивание для элемента , мы задаем выравнивание для всех ячеек данной строки. Аналогичным образом и для групп строк или столбцов.
Слайд 8
Размеры ячеек
Для ячеек
Слайд 9
Объединение ячеек
В некоторых задачах приходится строить таблицы, ячейки которых растянуты на несколько
столбцов или строк. Чаще всего это относится к ячейкам заголовков, реже к ячейкам данных таблицы. Ниже представлен пример такой таблицы:
Управление объединением ячеек происходит с помощью атрибутов элементов
,
,
, мы расположим соответственно только его содержимое. Задав выравнивание для всей строки
Тенет (16+)
и
можно указать размеры, используя стилевые свойства
width и height:
∙ width: ширина;
∙ height: высота;
В принципе, эти стилевые свойства можно использовать не только для указания размеров ячеек таблиц. С их помощью можно указать размеры любого блочного элемента страницы (например - абзаца или заголовков).
Тенет (16+)
и
:
colspan="N" - объединяет N столбцов
rowspan="N"- - объединяет N строк
Слайд 10
Пример кода
Слайд 11
Практика
Слайд 12
Практика
Слайд 13
Домашнее задание
Слайд 14
Нужно больше практики
Слайд 15
Домашнее задание
Слайд 16
Домашнее задание №2
Имя файла: Назначение-элементов-header,-nav,-article,-aside,-footer.pptx
Количество просмотров: 23
Количество скачиваний: 0
Скачать
- Предыдущая
Расчетно-кассовые операции
Следующая -
Искусство. Виды и жанры
Похожие презентации
Разработка информационной базы автоматизированной обучающей системы подготовки специалистов связи
Логические операции
Языки программирования (python)
New website. News, quick, links, tpeg
Аудио-контент в языке гипертекстковой разметки HTML
Revolution of Java
Файл и файловая структура
Технологии, используемые при проектировании виртуальной выставки
Основы телекоммуникаций сетей. Технологии телекоммуникационных сети TCP/IP
Структуры баз данных
Общие сведения о комплексах инженерно-технических средств физической защиты
Компьютерные вирусы и защита от них
Векторариума исследователь. Проект
Управление взаимоотношениями с клиентами DATA Mining
Разработка приложения с графическим интерфейсом средствами С# Windows forms
Интерфаол технологиялар. Таҳлил қиладиган технологиялар
Мир социальных сетей
Кроссворд Устройство компьютера
Дистанционная коммуникация
Студенты. Иллюстрация
Основные алгоритмические конструкции языка Pascal
Программирование (C++). Символьные строки
Годзилла 2. “Пробуди титана!”
Методы и средства обеспечения безопасности. Критерии оценки безопасности информационных технологий
Автозаполнение ячеек Excel
Тема 2_2 Лекция 5 Хранение информации
Dr.WEB® – это всё, что Вам нужно для защиты!
Реляционная модель баз данных
(function(d,s){d.getElementById("licnt7D89").src=
"https://counter.yadro.ru/hit?t12.1;r"+escape(d.referrer)+
((typeof(s)=="undefined")?"":";s"+s.width+"*"+s.height+"*"+
(s.colorDepth?s.colorDepth:s.pixelDepth))+";u"+escape(d.URL)+
";h"+escape(d.title.substring(0,150))+";"+Math.random()})
(document,screen)
Обратная связь
Для правообладателей
Email:
Нажмите что бы посмотреть
window.__NUXT__=(function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y){return {data:{meta:{result:{meta:{h1:l,main_text:b,main_title:m,main_description:n,main_keywords:o,main_image:b},app:{logo_image:p,logo_image_width:i,logo_image_height:q,logo_text:r,image_width_full:s,image_width_min:t,recaptcha_key:u,yandex_search:v,ya_context:e,banner_1:b,banner_2:b,banner_3:b,banner_4:b,banner_5:b,banner_6:b,banner_7:b,banner_8:b,banner_9:b,banner_10:b,email:w,footer_before:x,footer:y,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:z,item_images:A,item_images_tag:B,item_words_h3:c,item_words_tag:C,item_words_1:h,routing:D,item_slide_skipping:E,item_download_timeout:F,item_slider_width:a,item_show_pdf:c,item_show_contents:c,item_show_filename:e},colors:{header_text:j,header_bg:k,accent:G}},social:H}},item:{result:{id:1045510,name:"Назначение элементов header, nav, article, aside, footer",category:I,count:J,jpg:"jpg\u002F1045510",hits:K,download:a,h1:L,meta:{h1:L,title:"Назначение элементов header, nav, article, aside, footer презентация",description:"Назначение элементов header, nav, article, aside, footer презентация, доклад, проект, Информатика ",keywords:"Назначение элементов header, nav, article, aside, footer, презентация, доклад, проект, скачать презентацию на тему, PowerPoint, скачати презентацію, фон, шаблон, урок, конспект, класс, школа, класс, Информатика",download_link:b},text:"\u003Cp style=\"text-align: justify;\" \u002F\u003EПрезентация на тему Назначение элементов header, nav, article, aside, footer, из раздела: Информатика.  Презентацию в формате PowerPoint (pptx) можно скачать внизу страницы, поделившись ссылкой в социальных сетях! Презентации взяты из открытого доступа или загружены их авторами, администрация сайта не отвечает за достоверность информации в них. Все права принадлежат авторам материалов: \u003Ca href=\"politika-zashchity-avtorskih-prav\"\u003EПолитика защиты авторских прав\u003C\u002Fa\u003E",seo_text:"\u003Cp\u003EКонтрольные вопросы\u003Cbr\u003E\u003Cp\u003EНазначение элементов header, nav, article, aside, footer \u003Cbr\u003EНазначение элемента meta\u003Cbr\u003EЧто такое кодировка?\u003Cbr\u003EЗачем нужны символьные подстановки?\u003Cbr\u003EОтличие линейных и блочных тегов\u003Cbr\u003EОтличие физического и логического форматирования\u003Cbr\u003EОсновные форматы изображений для браузеров\u003Cbr\u003EКак сделать маркированный \u002F нумерованный список?\u003Cbr\u003EКак сделать многоуровневый список?\u003Cbr\u003EОсновные стили списков и их элементов\u003Cbr\u003E \u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EТабличное представление информации используется в тех случаях, когда необходимо вывести на страницу большое количество данных, характеризуемых однотипным набором данных. Примерами таких данных могут быть список фильмов, или каталог товаров Citrus\u002FRozetka\u002FOLX. \u003Cbr\u003E\u003Cbr\u003EТаблицы строятся с помощью элементов следующих типов: \u003Cbr\u003E\u003Cbr\u003Etable - собственно контейнер, содержащий таблицу. По стандарту, этот элемент может содержать только элементы группировки строк (thead, tfoot и tbody). \u003Cbr\u003Etbody - тело таблицы. Внутри этого элемента должны размещаться только строки таблицы. \u003Cbr\u003Etr - служит для создания строк таблицы. В строке могут размещаться элементы данных таблицы (td) или элементы заголовка (th)\u003Cbr\u003Etd - элемент данных таблицы\u003Cbr\u003Eth - элемент заголовка таблицы \u003Cbr\u003E\u003Cbr\u003E\u003Cp\u003E\u003Cbr\u003E\u003Cp\u003E\u003Cbr\u003E",file:"Назначение-элементов-header,-nav,-article,-aside,-footer.pptx",texts:["\u003Cp\u003ETables\u003Cbr\u003E\u003Cp\u003EАлександр Загоруйко © 2021\u003Cbr\u003E","\u003Cp\u003EКонтрольные вопросы\u003Cbr\u003E\u003Cp\u003EНазначение элементов header, nav, article, aside, footer \u003Cbr\u003EНазначение элемента meta\u003Cbr\u003EЧто такое кодировка?\u003Cbr\u003EЗачем нужны символьные подстановки?\u003Cbr\u003EОтличие линейных и блочных тегов\u003Cbr\u003EОтличие физического и логического форматирования\u003Cbr\u003EОсновные форматы изображений для браузеров\u003Cbr\u003EКак сделать маркированный \u002F нумерованный список?\u003Cbr\u003EКак сделать многоуровневый список?\u003Cbr\u003EОсновные стили списков и их элементов\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EТабличное представление информации используется в тех случаях, когда необходимо вывести на страницу большое количество данных, характеризуемых однотипным набором данных. Примерами таких данных могут быть список фильмов, или каталог товаров Citrus\u002FRozetka\u002FOLX. \u003Cbr\u003EТаблицы строятся с помощью элементов следующих типов: \u003Cbr\u003Etable - собственно контейнер, содержащий таблицу. По стандарту, этот элемент может содержать только элементы группировки строк (thead, tfoot и tbody). \u003Cbr\u003Etbody - тело таблицы. Внутри этого элемента должны размещаться только строки таблицы. \u003Cbr\u003Etr - служит для создания строк таблицы. В строке могут размещаться элементы данных таблицы (td) или элементы заголовка (th)\u003Cbr\u003Etd - элемент данных таблицы\u003Cbr\u003Eth - элемент заголовка таблицы \u003Cbr\u003E",M,"\u003Cp\u003EРезультат\u003Cbr\u003E\u003Cp\u003EКак вы сами можете убедиться, полученная таблица выглядит не совсем так, как хотелось бы. У привычных нам таблиц есть по крайней мере рамки! Добиться \"нормального\" внешнего вида нам помогут атрибуты элемента table: \u003Cbr\u003E∙\tborder - данный атрибут определяет наличие и толщину рамки таблицы. Если border имеет значение больше 0, то таблица, а так же каждая ее непустая ячейка, приобретет рамку. Кроме того, толщина внешней рамки таблицы определяется присвоенным значением. \u003Cbr\u003E∙\twidth - ширина всей таблицы. При этом, ширина каждого столбца таблицы подбирается автоматически на основании длины значений ячеек, составляющих данный столбец. Ширину таблицы можно указывать в пикселях или в процентах. В последнем случае сразу после числа ставится знак \"%\". \u003Cbr\u003E∙\tcellspacing - размер внешнего отступа от границ ячеек до соседних ячеек или рамки таблицы. \u003Cbr\u003E∙\tcellpadding - размер внутреннего отступа от границ ячеек до содержимого. \u003Cbr\u003E\u003Cp\u003E\u003Ctable border=\"1\" width=\"500\" cellspacing=\"0\" cellpadding=\"3\"\u003E\u003Cbr\u003E","\u003Cp\u003EДобавляем шапку\u003Cbr\u003E","\u003Cp\u003EВыравнивание данных\u003Cbr\u003E\u003Cp\u003EВыравнивать данные таблицы можно для каждой конкретной ячейки, для всей строки и для группы строк или столбцов (\u003Ctbody\u003E, \u003Cthead\u003E, \u003Ctfoot\u003E). Кроме того, данные можно выравнивать по горизонтали и вертикали. Для горизонтального выравнивания используется атрибут align, который может принимать следующие значения: \u003Cbr\u003E∙\tleft - по левой стороне ячейки \u003Cbr\u003E∙\tcenter - по правой стороне ячейки \u003Cbr\u003E∙\tright - по центру ячейки \u003Cbr\u003E∙\tjustify - по ширине ячейки. \u003Cbr\u003EДля вертикальоного выравнивания используется атрибут valign. Значения этого атрибута могут быть следующими: \u003Cbr\u003E∙\ttop - по верху ячейки \u003Cbr\u003E∙\tmiddle - по центру ячейки \u003Cbr\u003E∙\tbottom - по низу ячейки. \u003Cbr\u003EДля какого бы элемента вы ни указали атрибуты align или valign (\u003Ctd\u003E, \u003Cth\u003E, \u003Ctr\u003E или группе), выравнивание происходит относительно границ каждой ячейки. Указав выравнивание для элемента \u003Ctd\u003E, мы расположим соответственно только его содержимое. Задав выравнивание для всей строки \u003Ctr\u003E, мы задаем выравнивание для всех ячеек данной строки. Аналогичным образом и для групп строк или столбцов. \u003Cbr\u003E\u003Cp\u003E\u003Ctd align=\"center\"\u003EТенет (16+)\u003C\u002Ftd\u003E\u003Cbr\u003E","\u003Cp\u003EРазмеры ячеек\u003Cbr\u003E\u003Cp\u003EДля ячеек \u003Ctd\u003E и \u003Cth\u003E можно указать размеры, используя стилевые свойства width и height: \u003Cbr\u003E∙\twidth: ширина; \u003Cbr\u003E∙\theight: высота; \u003Cbr\u003EВ принципе, эти стилевые свойства можно использовать не только для указания размеров ячеек таблиц. С их помощью можно указать размеры любого блочного элемента страницы (например - абзаца или заголовков). \u003Cbr\u003E\u003Cp\u003E\u003Ctd style=\"width: 400px;\" align=\"center\"\u003EТенет (16+)\u003C\u002Ftd\u003E\u003Cbr\u003E","\u003Cp\u003EОбъединение ячеек\u003Cbr\u003E\u003Cp\u003EВ некоторых задачах приходится строить таблицы, ячейки которых растянуты на несколько столбцов или строк. Чаще всего это относится к ячейкам заголовков, реже к ячейкам данных таблицы. Ниже представлен пример такой таблицы: \u003Cbr\u003E \u003Cbr\u003E \u003Cbr\u003E \u003Cbr\u003E \u003Cbr\u003E\u003Cbr\u003EУправление объединением ячеек происходит с помощью атрибутов элементов \u003Ctd\u003E и \u003Cth\u003E: \u003Cbr\u003Ecolspan=\"N\" - объединяет N столбцов \u003Cbr\u003Erowspan=\"N\"- - объединяет N строк \u003Cbr\u003E",M,N,N,O,"\u003Cp\u003EНужно больше практики\u003Cbr\u003E",O,"\u003Cp\u003EДомашнее задание №2\u003Cbr\u003E","\u003Cp\u003EДомашнее задание №3\u003Cbr\u003E"],href:"\u002Fprezentacii-po-informatike\u002Fnaznachenie-elementov-header-nav-article-aside",href_category:"\u002Fprezentacii-po-informatike",date:1615053817,related:[{id:910966,name:"Разработка информационной базы автоматизированной обучающей системы подготовки специалистов связи",href:"\u002Fprezentacii-po-informatike\u002Frazrabotka-informatsionnoy-bazy-avtomatizirovannoy-obuchayushchey-sistemy",jpg:"jpg\u002F910966"},{id:1111091,name:"Логические операции",href:"\u002Fprezentacii-po-informatike\u002Flogicheskie-operatsii-20",jpg:"jpg\u002F1111091"},{id:1128388,name:"Языки программирования (python)",href:"\u002Fprezentacii-po-informatike\u002Fyazyki-programmirovaniya-python-1",jpg:"jpg\u002F1128388"},{id:1029041,name:"New website. News, quick, links, tpeg",href:"\u002Fprezentacii-po-informatike\u002Fnew-website-news-quick-links-tpeg",jpg:"jpg\u002F1029041"},{id:923298,name:"Аудио-контент в языке гипертекстковой разметки HTML",href:"\u002Fprezentacii-po-informatike\u002Faudio-kontent-v-yazyke-gipertekstkovoy-razmetki",jpg:"jpg\u002F923298"},{id:967204,name:"Revolution of Java",href:"\u002Fprezentacii-po-informatike\u002Frevolution-of-java",jpg:"jpg\u002F967204"},{id:1149183,name:"Файл и файловая структура",href:"\u002Fprezentacii-po-informatike\u002Ffayl-i-faylovaya-struktura-1",jpg:"jpg\u002F1149183"},{id:1114849,name:"Технологии, используемые при проектировании виртуальной выставки",href:"\u002Fprezentacii-po-informatike\u002Ftehnologii-ispolzuemye-pri-proektirovanii-virtualnoy-vystavki",jpg:"jpg\u002F1114849"},{id:1098724,name:"Основы телекоммуникаций сетей. Технологии телекоммуникационных сети TCP\u002FIP",href:"\u002Fprezentacii-po-informatike\u002Fosnovy-telekommunikatsiy-setey-tehnologii-telekommunikatsionnyh-seti",jpg:"jpg\u002F1098724"},{id:888632,name:"Структуры баз данных",href:"\u002Fprezentacii-po-informatike\u002Fstruktury-baz-dannyh-93",jpg:"jpg\u002F888632"},{id:1101002,name:"Общие сведения о комплексах инженерно-технических средств физической защиты",href:"\u002Fprezentacii-po-informatike\u002Fobshchie-svedeniya-o-kompleksah-inzhenerno-tehnicheskih-1",jpg:"jpg\u002F1101002"},{id:483361,name:"Компьютерные вирусы и защита от них",href:"\u002Fprezentacii-po-informatike\u002F13185-kompyuternye-virusy-i-zashhita-ot-nix",jpg:"jpg\u002F483361"},{id:1077723,name:"Векторариума исследователь. Проект",href:"\u002Fprezentacii-po-informatike\u002Fvektorariuma-issledovatel-proekt",jpg:"jpg\u002F1077723"},{id:912906,name:"Управление взаимоотношениями с клиентами DATA Mining",href:"\u002Fprezentacii-po-informatike\u002Fupravlenie-vzaimootnosheniyami-s-klientami-data-mining-d3-2",jpg:"jpg\u002F912906"},{id:868024,name:"Разработка приложения с графическим интерфейсом средствами С# Windows forms",href:"\u002Fprezentacii-po-informatike\u002Frazrabotka-prilozheniya-s-graficheskim-interfeysom-sredstvami",jpg:"jpg\u002F868024"},{id:1113680,name:"Интерфаол технологиялар. Таҳлил қиладиган технологиялар",href:"\u002Fprezentacii-po-informatike\u002Finterfaol-tehnologiyalar-talil-iladigan-tehnologiyalar",jpg:"jpg\u002F1113680"},{id:1142889,name:"Мир социальных сетей",href:"\u002Fprezentacii-po-informatike\u002Fmir-sotsialnyh-setey",jpg:"jpg\u002F1142889"},{id:1045106,name:"Кроссворд Устройство компьютера",href:"\u002Fprezentacii-po-informatike\u002Fkrossvord-ustroystvo-kompyutera",jpg:"jpg\u002F1045106"},{id:836635,name:"Дистанционная коммуникация",href:"\u002Fprezentacii-po-informatike\u002Fdistantsionnaya-kommunikatsiya",jpg:"jpg\u002F836635"},{id:853856,name:"Студенты. Иллюстрация",href:"\u002Fprezentacii-po-informatike\u002Fstudenty-illyustratsiya",jpg:"jpg\u002F853856"},{id:1077322,name:"Основные алгоритмические конструкции языка Pascal",href:"\u002Fprezentacii-po-informatike\u002Fosnovnye-algoritmicheskie-konstruktsii-yazyka-pascal",jpg:"jpg\u002F1077322"},{id:1079893,name:"Программирование (C++). Символьные строки",href:"\u002Fprezentacii-po-informatike\u002Fprogrammirovanie-c-simvolnye-stroki",jpg:"jpg\u002F1079893"},{id:1104412,name:"Годзилла 2. “Пробуди титана!”",href:"\u002Fprezentacii-po-informatike\u002Fgodzilla-2-probudi-titana",jpg:"jpg\u002F1104412"},{id:878021,name:"Методы и средства обеспечения безопасности. Критерии оценки безопасности информационных технологий",href:"\u002Fprezentacii-po-informatike\u002Fmetody-i-sredstva-obespecheniya-bezopasnosti-kriterii-1",jpg:"jpg\u002F878021"},{id:982365,name:"Автозаполнение ячеек Excel",href:"\u002Fprezentacii-po-informatike\u002Favtozapolnenie-yacheek-excel",jpg:"jpg\u002F982365"},{id:1001550,name:"Тема 2_2 Лекция 5 Хранение информации",href:"\u002Fprezentacii-po-informatike\u002Ftema-22-lektsiya-5-hranenie-informatsii",jpg:"jpg\u002F1001550"},{id:1155355,name:"Dr.WEB® – это всё, что Вам нужно для защиты!",href:"\u002Fprezentacii-po-informatike\u002Fdrweb--eto-vsyo-chto-vam",jpg:"jpg\u002F1155355"},{id:1081770,name:"Реляционная модель баз данных",href:"\u002Fprezentacii-po-informatike\u002Frelyatsionnaya-model-baz-dannyh",jpg:"jpg\u002F1081770"}],navigation:{next:"\u002Fprezentacii-na-razlichnye-temy\u002Fiskusstvo-vidy-i-zhanry-1",next_name:"Искусство. Виды и жанры",prev:"\u002Fprezentacii-na-razlichnye-temy\u002Fraschetno-kassovye-operatsii-1",prev_name:"Расчетно-кассовые операции"}}},categories:{result:[{id:P,ordering:a,name:"Алгебра",pseudoname:"prezentacii-po-algebre"},{id:2,ordering:a,name:"Английский язык",pseudoname:"prezentacii-po-angliyskomu-yaziku"},{id:3,ordering:a,name:"Астрономия",pseudoname:"prezentacii-po-astronomii"},{id:4,ordering:a,name:"Биология",pseudoname:"prezentacii-po-biologii"},{id:5,ordering:a,name:"География",pseudoname:"prezentacii-po-geografii"},{id:6,ordering:a,name:"Геометрия",pseudoname:"prezentacii-po-geometrii"},{id:7,ordering:a,name:I,pseudoname:"prezentacii-po-informatike"},{id:8,ordering:a,name:"История",pseudoname:"prezentacii-po-istorii"},{id:9,ordering:a,name:"Литература",pseudoname:"prezentacii-po-literature"},{id:10,ordering:a,name:"Математика",pseudoname:"prezentacii-po-matematike"},{id:11,ordering:a,name:"Медицина",pseudoname:"prezentacii-po-medicine"},{id:h,ordering:a,name:"Музыка",pseudoname:"prezentacii-po-musice"},{id:13,ordering:a,name:"МХК",pseudoname:"prezentacii-po-mkhk"},{id:14,ordering:a,name:"ОБЖ",pseudoname:"prezentacii-po-obzh"},{id:15,ordering:a,name:"Обществознание",pseudoname:"prezentacii-po-obshhestvoznaniju"},{id:J,ordering:a,name:"Педагогика",pseudoname:"prezentacii-po-pedagogike"},{id:18,ordering:a,name:"Немецкий язык",pseudoname:"prezentacii-po-nemezkomy-yaziku"},{id:20,ordering:a,name:"Русский язык",pseudoname:"prezentacii-po-russkomu-yazyku"},{id:21,ordering:a,name:"Технология",pseudoname:"prezentacii-po-tehnologii"},{id:22,ordering:a,name:"Физика",pseudoname:"prezentacii-po-fizike"},{id:K,ordering:a,name:"Философия",pseudoname:"prezentacii-po-filosofii"},{id:24,ordering:a,name:"Химия",pseudoname:"prezentacii-po-himii"},{id:25,ordering:a,name:"Экология",pseudoname:"prezentacii-po-ehkologii"},{id:26,ordering:a,name:"Экономика",pseudoname:"prezentacii-po-ekonomike"},{id:27,ordering:a,name:"Детские презентации",pseudoname:"detskie-prezentacii"},{id:i,ordering:a,name:"Шаблоны презентаций",pseudoname:"shablony-dlya-prezentacii"},{id:29,ordering:a,name:"Разное",pseudoname:"prezentacii-na-razlichnye-temy"},{id:48,ordering:a,name:"Культурология",pseudoname:"kulturologiya"},{id:16,ordering:P,name:"Окружающий мир",pseudoname:"prezentacii-po-okruzhayushhemu-miru"}]}},state:{},_errors:{},serverRendered:e,config:{public:{SITE_NAME:Q,SITE_HOST:"slaidy.com",SITE_LANG:R,API_BASE_URL:"https:\u002F\u002Fslaidy.com\u002Fapi\u002F",pwaManifest:{name:Q,short_name:b,description:b,lang:R,start_url:"\u002F?standalone=true",display:"standalone",background_color:k,theme_color:j,icons:[{src:"\u002F_nuxt\u002Ficons\u002F64x64.d7f48e96.png",type:d,sizes:S,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F64x64.maskable.d7f48e96.png",type:d,sizes:S,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F120x120.d7f48e96.png",type:d,sizes:T,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F120x120.maskable.d7f48e96.png",type:d,sizes:T,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F144x144.d7f48e96.png",type:d,sizes:U,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F144x144.maskable.d7f48e96.png",type:d,sizes:U,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F152x152.d7f48e96.png",type:d,sizes:V,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F152x152.maskable.d7f48e96.png",type:d,sizes:V,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F192x192.d7f48e96.png",type:d,sizes:W,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F192x192.maskable.d7f48e96.png",type:d,sizes:W,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F384x384.d7f48e96.png",type:d,sizes:X,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F384x384.maskable.d7f48e96.png",type:d,sizes:X,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F512x512.d7f48e96.png",type:d,sizes:Y,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F512x512.maskable.d7f48e96.png",type:d,sizes:Y,purpose:g}]},yandexMetrika:{id:"79446466",metrikaUrl:"https:\u002F\u002Fmc.yandex.ru\u002Fmetrika\u002Ftag.js",accurateTrackBounce:e,childIframe:c,clickmap:c,defer:c,useRuntimeConfig:e,trackHash:c,trackLinks:e,type:a,webvisor:c,triggerEvent:c,consoleLog:e,partytown:c,isDev:c}},app:{baseURL:"\u002F",buildAssetsDir:"\u002F_nuxt\u002F",cdnURL:b}},pinia:{app:{meta:{h1:l,main_text:b,main_title:m,main_description:n,main_keywords:o,main_image:b},app:{logo_image:p,logo_image_width:i,logo_image_height:q,logo_text:r,image_width_full:s,image_width_min:t,recaptcha_key:u,yandex_search:v,ya_context:e,banner_1:b,banner_2:b,banner_3:b,banner_4:b,banner_5:b,banner_6:b,banner_7:b,banner_8:b,banner_9:b,banner_10:b,email:w,footer_before:x,footer:y,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:z,item_images:A,item_images_tag:B,item_words_h3:c,item_words_tag:C,item_words_1:h,routing:D,item_slide_skipping:E,item_download_timeout:F,item_slider_width:a,item_show_pdf:c,item_show_contents:c,item_show_filename:e},colors:{header_text:j,header_bg:k,accent:G}},social:H,token:b}}}}(0,"",false,"image\u002Fpng",true,"any","maskable",12,28,"#000000","#ffffff","Презентации, проекты, доклады в PowerPoint на любую тему","Презентации и проекты в PowerPoint","Презентации на различные темы для детей, школьников, родителей, студентов, учителей и преподавателей.","Презентация, презентация на тему, скачать презентацию, урок презентация, 1 2 3 4 5 6 7 8 9 10 11 класс","images\u002Fdata\u002Flogo.jpg",32,"Slaidy.com",720,480,"6LdhFOUnAAAAAIaOUjFtosEpzs6Ny643k1QKXXvv","3190226","[e-mail]","\u003C!--LiveInternet counter--\u003E\u003Ca href=\"https:\u002F\u002Fwww.liveinternet.ru\u002Fclick\"\r\ntarget=\"_blank\"\u003E\u003Cimg id=\"licnt7D89\" width=\"88\" height=\"31\" style=\"border:0\" \r\ntitle=\"LiveInternet: показано число просмотров за 24 часа, посетителей за 24 часа и за сегодня\"\r\nsrc=\"data:image\u002Fgif;base64,R0lGODlhAQABAIAAAAAAAP\u002F\u002F\u002FyH5BAEAAAEALAAAAAABAAEAAAIBTAA7\"\r\nalt=\"LiveInternet\"\u002F\u003E\u003C\u002Fa\u003E\u003Cscript\u003E(function(d,s){d.getElementById(\"licnt7D89\").src=\r\n\"https:\u002F\u002Fcounter.yadro.ru\u002Fhit?t12.1;r\"+escape(d.referrer)+\r\n((typeof(s)==\"undefined\")?\"\":\";s\"+s.width+\"*\"+s.height+\"*\"+\r\n(s.colorDepth?s.colorDepth:s.pixelDepth))+\";u\"+escape(d.URL)+\r\n\";h\"+escape(d.title.substring(0,150))+\";\"+Math.random()})\r\n(document,screen)\u003C\u002Fscript\u003E\u003C!--\u002FLiveInternet--\u003E","\u003Ca href=\"\u002Fpage\u002Fpravoobladateliam\"\u003EДля правообладателей\u003C\u002Fa\u003E","h3a","images_before","none","h3","category","both",77,"#ff0d00","\u003Cscript src=\"\u002F\u002Fyastatic.net\u002Fes5-shims\u002F0.0.2\u002Fes5-shims.min.js\"\u003E\u003C\u002Fscript\u003E\r\n\u003Cscript src=\"\u002F\u002Fyastatic.net\u002Fshare2\u002Fshare.js\"\u003E\u003C\u002Fscript\u003E\r\n\u003Cdiv class=\"ya-share2\" data-services=\"collections,gplus,vkontakte,facebook,odnoklassniki,gplus,twitter,moimir\" data-counter=\"\"\u003E\u003C\u002Fdiv\u003E","Информатика",17,23,"Назначение элементов header, nav, article, aside, footer ","\u003Cp\u003EПример кода\u003Cbr\u003E","\u003Cp\u003EПрактика\u003Cbr\u003E","\u003Cp\u003EДомашнее задание\u003Cbr\u003E",1,"Slaidy","ru","64x64","120x120","144x144","152x152","192x192","384x384","512x512"))

Добавляем шапку

Выравнивание данных
Выравнивать данные таблицы можно для каждой конкретной ячейки, для всей строки и для группы строк или столбцов (

Размеры ячеек
Для ячеек

Объединение ячеек
В некоторых задачах приходится строить таблицы, ячейки которых растянуты на несколько столбцов или строк. Чаще всего это относится к ячейкам заголовков, реже к ячейкам данных таблицы. Ниже представлен пример такой таблицы:
Управление объединением ячеек происходит с помощью атрибутов элементов

Пример кода

Практика

Практика

Домашнее задание

Нужно больше практики

Домашнее задание

Домашнее задание №2