Информационно-технологический модуль. Overflow. Display. Псевдоэлементы 2019 презентация

2019
OVERFLOW
overflow управляет отображением содержания блочного элемента, если оно целиком не помещается и выходит за область заданных размеров.
Синтаксис
overflow: auto | hidden | scroll | visible
Значения
visible отображается все содержание элемента, даже за пределами установленной высоты и ширины. (по умолчанию).
hidden отображается только область внутри элемента, остальное будет скрыто.
scroll всегда добавляются полосы прокрутки.
auto полосы прокрутки добавляются только при необходимости.
Варианты: overflow-x, overflow-y.

2019
DISPLAY
display многоцелевое свойство, которое определяет, как элемент должен быть показан в документе.
Синтаксис
display: block | inline | inline-block | inline-table | list-item | none
Значения
Список возможных значений этого свойства, понимаемый разными браузерами очень короткий — block, inline, list-item и none. Все остальные допустимые значения поддерживаются браузерами выборочно.

2019
block элемент показывается как блочный. Применение этого значения для встроенных элементов, например, тега
, заставляет его вести подобно блокам — происходит перенос строк в начале и в конце содержимого.
inline элемент отображается как встроенный. Использование блочных тегов, таких как
и
, автоматически создает перенос и показывает содержимое этих тегов с новой строки. Значение inline отменяет эту особенность, поэтому содержимое блочных элементов начинается с того места, где окончился предыдущий элемент.
inline-block это значение генерирует блочный элемент, который обтекается другими элементами веб-страницы подобно встроенному элементу. Фактически такой элемент по своему действию похож на встраиваемые элементы (вроде тега
). При этом его внутренняя часть форматируется как блочный элемент, а сам элемент — как встроенный.
list-item элемент выводится как блочный и добавляется маркер списка.
none временно удаляет элемент из документа. Занимаемое им место не резервируется, и веб-страница формируется так, словно элемента и не было. Изменить значение и сделать вновь видимым элемент можно с помощью скриптов, обращаясь к свойствам через объектную модель. В этом случае происходит переформатирование данных на странице с учетом вновь добавленного элемента.
run-in устанавливает элемент как блочный или встроенный в зависимости от контекста.

2019
inline-table определяет, что элемент является таблицей как при использовании тега
, но при
этом таблица является встроенным элементом и происходит ее обтекание другими элементами, например, текстом.
table определяет, что элемент является блочной таблицей подобно использованию тега
. table-caption задает заголовок таблицы подобно применению тега .
table-header-group элемент предназначен для хранения одной или нескольких строк ячеек, которые представлены вверху таблицы. По своему действию сходно с работой тега .
table-row-group создает структурный блок, состоящий из нескольких строк таблицы аналогично действию тега .
table-row элемент отображается как строка таблицы (тег ).
Слайд 6
Текст
используется для выделения в тексте цитат. Содержимое контейнера автоматически отображается в браузере
в кавычках.
Синтаксис
Текст
quotes устанавливает тип кавычек, который применяется в тексте документа.
Синтаксис
quotes: "левая кавычка" "правая кавычка" | none
2019
ДОПОЛНЕНИЕ
Слайд 7
2019
Слайд 8
Псевдоэлемент в CSS — это ключевое слово, добавляемое к селектору, которое позволяет стилизовать
определённую часть выбранного элемента.
2019
ПСЕВДОЭЛЕМЕНТЫ
Селектор::псевдоэлемент {
свойство: значение;
--------
свойство: значение;
}
Селектор дополнительные теги::псевдоэлемент {
свойство: значение;
--------
свойство: значение;
}
Слайд 9
2019
content позволяет вставлять генерируемое содержание в текст веб-страницы, которое первоначально в тексте отсутствует.
Применяется совместно с псевдоэлементами :after и :before, они соответственно указывают отображать новое содержимое после или до элемента, к которому добавляются.
Синтаксис
content: строка | attr(параметр) | open-quote | close-quote | no-open-quote | no-close-quote | url | counter | normal | none
Значения
Строка текст, который добавляется на веб-страницу, строка при этом должна браться в двойные или одинарные кавычки. Допускается использовать юникод для вставки спецсимволов. Спецсимволы HTML которые начинаются с амперсанда (§ например), будут отображаться как есть, т.е. простым текстом (§, а не §).
Слайд 10
2019
attr(параметр) возвращает строку, которая является значением параметра тега указанного в скобках. Например, a:after
{content:attr(href)} добавит после ссылки её адрес, т.е. значение атрибута href. Если указанного атрибута нет, вернется пустая строка.
open-quote вставляет открывающую кавычку, тип которой устанавливается с помощью стилевого свойства quotes.
close-quote вставляет закрывающую кавычку.
no-open-quotes отменяет добавление открывающей кавычки.
no-close-quote отменяет добавление закрывающей кавычки.
url абсолютный или относительный адрес вставляемого объекта. Если указанный файл браузер не может отобразить, то значение игнорируется.
none не добавляет никакое содержание.
normal задается как none для псевдоэлементов ::before и ::after.
Слайд 11
2019
::after или :after псевдоэлемент, который используется для вывода желаемого текста после содержимого элемента,
к которому он добавляется. Псевдоэлемент ::after работает совместно со свойством content.
Для ::after характерны следующие особенности.
При добавлении ::after к блочному элементу, значение свойства display может быть только: block, inline, none, marker. Все остальные значения будут трактоваться как block.
При добавлении ::after к встроенному элементу, display ограничен значениями inline и none. Все остальные будут восприниматься как inline.
Синтаксис
селектор::after { … } или селектор доп теги::after { … }
Слайд 12
2019
::before или :before применяется для отображения желаемого контента до содержимого элемента, к которому
он добавляется. Работает совместно со свойством content.
Для ::before характерны следующие особенности. При добавлении ::before к блочному элементу, значение свойства display может быть только: block, inline, none, marker. Все остальные значения будут трактоваться как block. При добавлении ::before к встроенному элементу, display ограничен значениями inline и none. Все остальные будут восприниматься как inline. ::before наследует стиль от элемента, к которому он добавляется.
Синтаксис
селектор::before { … } или селектор доп теги::before { … }
Слайд 13
2019
::first-letter или :first-letter определяет стиль первого символа в тексте элемента, к которому добавляется.
К этому псевдоэлементу могут применяться только стилевые свойства, связанные со свойствами шрифта, полями, отступами, границами, цветом и фоном.
Синтаксис
селектор::first-letter { ... } или селектор доп теги::first-letter { ... }
::first-line или :first-line задает стиль первой строки форматированного текста. Длина этой строки зависит от многих факторов, таких как используемый шрифт, размер окна браузера, ширина блока, языка и т.д. В правилах стиля допустимо использовать только свойства, относящиеся к шрифту, изменению цвета текста и фона.
Синтаксис
селектор::first-line { ... } или селектор доп теги::first-line { ... }
::selection применяет стиль к выделенному пользователем тексту. В правилах стилей допускается использовать следующие свойства: color, background и background-color.
Синтаксис
селектор::selection { ... } или селектор доп теги::selection { ... }
Имя файла: Информационно-технологический-модуль.-Overflow.-Display.-Псевдоэлементы-2019.pptx
Количество просмотров: 80
Количество скачиваний: 0
Скачать
- Предыдущая
Метод проекта в обучении литературе
Следующая -
Девушки-режиссёры в современном кинематографе
Похожие презентации
Интернет зияны Анти-интернет тобы
Основы программирование на Python
Работа с формулами в текстовом редакторе WORD
Библиографическое описание разных видов документов
1С-Битрикс. Сайт медицинской организации
Мастер-класс. Как с помощью видеопрезентаций увеличить прибыль при продаже информационных продуктов
Язык программирования Python. Основы языка Python. Линейные программы
Использование динамически выделяемой памяти
Устройство персонального компьютера
Оргтехника и специальность
Искусственный интеллект: история развития, понятие, значение, классификация
Двумерные массивы
Информационные технологии автоматизированного проектирования
Технологии передачи-2
Інтелектуальний аналіз даних
Базы данных и SQL
Цифровое детство: компетентность и безопасность
Майкрософт туралы мәлімет
Относительные, абсолютные и смешанные ссылки
Декодирование информации
Устройство персонального компьютера
Конструктор мультфильмов
RAM, ROM and Virtual memory
Интерфейс и примитивы
Контур. Бухгалтерия. Получение и установка сертификата
Разработка сайта “Интернет - магазин одежды Dieshh
Разработка требований к ИС. Управление требованиями к ИС
Искусственный интеллект сегодня
Обратная связь
Email:
Нажмите что бы посмотреть
.
table-cell указывает, что элемент представляет собой ячейку таблицы (тег
или
).
table-footer-group используется для хранения одной или нескольких строк ячеек, которые отображаются в самом низу таблицы. По своему действию сходно с работой тега
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){return {data:{meta:{result:{meta:{h1:m,main_text:a,main_title:n,main_description:o,main_keywords:p,main_image:a},app:{logo_image:q,logo_image_width:r,logo_image_height:s,logo_text:a,image_width_full:t,image_width_min:u,recaptcha_key:v,yandex_search:w,ya_context:c,banner_1:a,banner_2:a,banner_3:a,banner_4:a,banner_5:a,banner_6:a,banner_7:a,banner_8:a,banner_9:a,banner_10:a,email:x,footer_before:a,footer:a,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:y,item_images:z,item_images_tag:A,item_words_h3:c,item_words_tag:B,item_words_1:h,routing:C,item_slide_skipping:D,item_download_timeout:j,item_slider_width:E,item_show_pdf:e,item_show_contents:e,item_show_filename:e},colors:{header_text:k,header_bg:i,accent:i}},social:F}},item:{result:{id:191445,name:l,category:G,count:H,jpg:"jpg\u002F191445",hits:j,download:b,h1:"Информационно-технологический модуль. Overflow. Display. Псевдоэлементы 2019 презентация",meta:{h1:l,title:l,description:"Информационно-технологический модуль. Overflow. Display. Псевдоэлементы 2019 презентация на тему, доклад, Информатика",keywords:"Информационно-технологический модуль. Overflow. Display. Псевдоэлементы 2019, презентация, доклад, проект, скачать, на тему, PowerPoint, урок, класс, школа, Информатика",download_link:a},text:"Вы можете изучить и скачать доклад-презентацию на тему Презентация на тему Информационно-технологический модуль. Overflow. Display. Псевдоэлементы 2019 из раздела Информатика. Презентация на заданную тему содержит 14 слайдов. Для просмотра воспользуйтесь проигрывателем, если материал оказался полезным для Вас - поделитесь им с друзьями с помощью социальных кнопок и добавьте наш сайт презентаций в закладки!",seo_text:"\u003Cp\u003E\u003Cbr\u003E\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003EOVERFLOW\u003Cbr\u003E\u003Cp\u003E\toverflow управляет отображением содержания блочного элемента, если оно целиком не помещается и выходит за область заданных размеров.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\toverflow: auto | hidden | scroll | visible \u003Cbr\u003E\tЗначения\u003Cbr\u003E\tvisibl",file:"Информационно-технологический-модуль.-Overflow.-Display.-Псевдоэлементы-2019.pptx",texts:["\u003Cp\u003EOVERFLOW. DISPLAY. ПСЕВДОЭЛЕМЕНТЫ\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003EOVERFLOW\u003Cbr\u003E\u003Cp\u003E\toverflow управляет отображением содержания блочного элемента, если оно целиком не помещается и выходит за область заданных размеров.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\toverflow: auto | hidden | scroll | visible \u003Cbr\u003E\tЗначения\u003Cbr\u003E\tvisible отображается все содержание элемента, даже за пределами установленной высоты и ширины. (по умолчанию).\u003Cbr\u003E\thidden отображается только область внутри элемента, остальное будет скрыто.\u003Cbr\u003E\tscroll всегда добавляются полосы прокрутки.\u003Cbr\u003E\tauto полосы прокрутки добавляются только при необходимости.\u003Cbr\u003E\tВарианты: overflow-x, overflow-y.\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003EDISPLAY\u003Cbr\u003E\u003Cp\u003E\tdisplay многоцелевое свойство, которое определяет, как элемент должен быть показан в документе.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\tdisplay: block | inline | inline-block | inline-table | list-item | none\u003Cbr\u003E\tЗначения\u003Cbr\u003E\tСписок возможных значений этого свойства, понимаемый разными браузерами очень короткий — block, inline, list-item и none. Все остальные допустимые значения поддерживаются браузерами выборочно. \u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003E\tblock\tэлемент показывается как блочный. Применение этого значения для встроенных элементов, например, тега \u003Cspan\u003E, заставляет его вести подобно блокам — происходит перенос строк в начале и в конце содержимого.\u003Cbr\u003E\tinline\tэлемент отображается как встроенный. Использование блочных тегов, таких как \u003Cdiv\u003E и \u003Cp\u003E, автоматически создает перенос и показывает содержимое этих тегов с новой строки. Значение inline отменяет эту особенность, поэтому содержимое блочных элементов начинается с того места, где окончился предыдущий элемент.\t\u003Cbr\u003E\tinline-block\tэто значение генерирует блочный элемент, который обтекается другими элементами веб-страницы подобно встроенному элементу. Фактически такой элемент по своему действию похож на встраиваемые элементы (вроде тега \u003Cimg\u003E). При этом его внутренняя часть форматируется как блочный элемент, а сам элемент — как встроенный.\t\t\u003Cbr\u003E\tlist-item\tэлемент выводится как блочный и добавляется маркер списка.\t\t\u003Cbr\u003E\tnone временно удаляет элемент из документа. Занимаемое им место не резервируется, и веб-страница формируется так, словно элемента и не было. Изменить значение и сделать вновь видимым элемент можно с помощью скриптов, обращаясь к свойствам через объектную модель. В этом случае происходит переформатирование данных на странице с учетом вновь добавленного элемента.\u003Cbr\u003E\trun-in устанавливает элемент как блочный или встроенный в зависимости от контекста.\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003E\tinline-table определяет, что элемент является таблицей как при использовании тега \u003Ctable\u003E, но при этом таблица является встроенным элементом и происходит ее обтекание другими элементами, например, текстом.\t\t\t\t\t\u003Cbr\u003E\ttable определяет, что элемент является блочной таблицей подобно использованию тега \u003Ctable\u003E.\ttable-caption задает заголовок таблицы подобно применению тега \u003Ccaption\u003E.\t \u003Cbr\u003E\ttable-cell указывает, что элемент представляет собой ячейку таблицы (тег \u003Ctd\u003E или \u003Cth\u003E).\t \t\u003Cbr\u003E\ttable-footer-group используется для хранения одной или нескольких строк ячеек, которые отображаются в самом низу таблицы. По своему действию сходно с работой тега \u003Ctfoot\u003E.\u003Cbr\u003E\ttable-header-group элемент предназначен для хранения одной или нескольких строк ячеек, которые представлены вверху таблицы. По своему действию сходно с работой тега \u003Cthead\u003E.\u003Cbr\u003E\ttable-row-group создает структурный блок, состоящий из нескольких строк таблицы аналогично действию тега \u003Ctbody\u003E.\u003Cbr\u003E\ttable-row элемент отображается как строка таблицы (тег \u003Ctr\u003E).\t \u003Cbr\u003E","\u003Cp\u003E\t\u003Cq\u003EТекст\u003C\u002Fq\u003E используется для выделения в тексте цитат. Содержимое контейнера автоматически отображается в браузере в кавычках.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\t\u003Cq\u003EТекст\u003C\u002Fq\u003E\u003Cbr\u003E\t\u003Cbr\u003E\tquotes устанавливает тип кавычек, который применяется в тексте документа.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\tquotes: \"левая кавычка\" \"правая кавычка\" | none\u003Cbr\u003E\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003EДОПОЛНЕНИЕ\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E","\u003Cp\u003E\tПсевдоэлемент в CSS — это ключевое слово, добавляемое к селектору, которое позволяет стилизовать определённую часть выбранного элемента.\u003Cbr\u003E\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003EПСЕВДОЭЛЕМЕНТЫ\u003Cbr\u003E\u003Cp\u003EСелектор::псевдоэлемент {\u003Cbr\u003E\t\tсвойство: значение;\u003Cbr\u003E\t\t--------\u003Cbr\u003E\t\tсвойство: значение;\u003Cbr\u003E}\u003Cbr\u003E\u003Cp\u003EСелектор дополнительные теги::псевдоэлемент {\u003Cbr\u003E\t\tсвойство: значение;\u003Cbr\u003E\t\t--------\u003Cbr\u003E\t\tсвойство: значение;\u003Cbr\u003E}\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003E\tcontent позволяет вставлять генерируемое содержание в текст веб-страницы, которое первоначально в тексте отсутствует. Применяется совместно с псевдоэлементами :after и :before, они соответственно указывают отображать новое содержимое после или до элемента, к которому добавляются.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\tcontent: строка | attr(параметр) | open-quote | close-quote | no-open-quote | no-close-quote | url | counter | normal | none \u003Cbr\u003E\tЗначения\u003Cbr\u003E\tСтрока текст, который добавляется на веб-страницу, строка при этом должна браться в двойные или одинарные кавычки. Допускается использовать юникод для вставки спецсимволов. Спецсимволы HTML которые начинаются с амперсанда (§ например), будут отображаться как есть, т.е. простым текстом (§, а не §).\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003E\tattr(параметр) возвращает строку, которая является значением параметра тега указанного в скобках. Например, a:after {content:attr(href)} добавит после ссылки её адрес, т.е. значение атрибута href. Если указанного атрибута нет, вернется пустая строка.\u003Cbr\u003E\topen-quote вставляет открывающую кавычку, тип которой устанавливается с помощью стилевого свойства quotes.\u003Cbr\u003E\tclose-quote вставляет закрывающую кавычку.\u003Cbr\u003E\tno-open-quotes отменяет добавление открывающей кавычки.\u003Cbr\u003E\tno-close-quote отменяет добавление закрывающей кавычки.\u003Cbr\u003E\turl абсолютный или относительный адрес вставляемого объекта. Если указанный файл браузер не может отобразить, то значение игнорируется.\u003Cbr\u003E\tnone не добавляет никакое содержание.\u003Cbr\u003E\tnormal задается как none для псевдоэлементов ::before и ::after.\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003E\t::after или :after псевдоэлемент, который используется для вывода желаемого текста после содержимого элемента, к которому он добавляется. \tПсевдоэлемент ::after работает совместно со свойством content.\u003Cbr\u003E\tДля ::after характерны следующие особенности.\u003Cbr\u003E\tПри добавлении ::after к блочному элементу, значение свойства display может быть только: block, inline, none, marker. Все остальные значения будут трактоваться как block.\u003Cbr\u003E\tПри добавлении ::after к встроенному элементу, display ограничен значениями inline и none. Все остальные будут восприниматься как inline.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\tселектор::after { … } или селектор доп теги::after { … } \u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003E\t::before или :before применяется для отображения желаемого контента до содержимого элемента, к которому он добавляется. Работает совместно со свойством content.\u003Cbr\u003E\tДля ::before характерны следующие особенности. При добавлении ::before к блочному элементу, значение свойства display может быть только: block, inline, none, marker. Все остальные значения будут трактоваться как block. \tПри добавлении ::before к встроенному элементу, display ограничен значениями inline и none. Все остальные будут восприниматься как inline. ::before наследует стиль от элемента, к которому он добавляется.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\tселектор::before { … } или селектор доп теги::before { … }\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003E\t::first-letter или :first-letter определяет стиль первого символа в тексте элемента, к которому добавляется. К этому псевдоэлементу могут применяться только стилевые свойства, связанные со свойствами шрифта, полями, отступами, границами, цветом и фоном.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\tселектор::first-letter { ... } или селектор доп теги::first-letter { ... } \u003Cbr\u003E\t\u003Cbr\u003E\t::first-line или :first-line задает стиль первой строки форматированного текста. Длина этой строки зависит от многих факторов, таких как используемый шрифт, размер окна браузера, ширина блока, языка и т.д. В правилах стиля допустимо использовать только свойства, относящиеся к шрифту, изменению цвета текста и фона.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\tселектор::first-line { ... } или селектор доп теги::first-line { ... } \u003Cbr\u003E\t\u003Cbr\u003E\t::selection применяет стиль к выделенному пользователем тексту. В правилах стилей допускается использовать следующие свойства: color, background и background-color.\u003Cbr\u003E\tСинтаксис\u003Cbr\u003E\tселектор::selection { ... } или селектор доп теги::selection { ... }\u003Cbr\u003E","\u003Cp\u003E2019\u003Cbr\u003E\u003Cp\u003EСпасибо за внимание!\u003Cbr\u003E"],href:"\u002Finformatika\u002Finformatsionno-tehnologicheskiy-modul-overflow-display-psevdoelementy",href_category:"\u002Finformatika",date:1633666823,related:[{id:312603,name:"Интернет зияны Анти-интернет тобы",href:"\u002Finformatika\u002Finternet-ziyany-anti-internet-toby",jpg:"jpg\u002F312603"},{id:597560,name:"Основы программирование на Python",href:"\u002Finformatika\u002Fosnovy-programmirovanie-na-python",jpg:"jpg\u002F597560"},{id:412874,name:"Работа с формулами в текстовом редакторе WORD",href:"\u002Finformatika\u002Frabota-s-formulami-v-tekstovom-redaktore",jpg:"jpg\u002F412874"},{id:223409,name:"Библиографическое описание разных видов документов",href:"\u002Finformatika\u002Fbibliograficheskoe-opisanie-raznyh-vidov-dokumentov",jpg:"jpg\u002F223409"},{id:298427,name:"1С-Битрикс. Сайт медицинской организации",href:"\u002Finformatika\u002F1s-bitriks-sayt-meditsinskoy-organizatsii",jpg:"jpg\u002F298427"},{id:107859,name:"Мастер-класс. Как с помощью видеопрезентаций увеличить прибыль при продаже информационных продуктов",href:"\u002Finformatika\u002Fmaster-klass-kak-s-pomoshchyu-videoprezentatsiy",jpg:"jpg\u002F107859"},{id:576047,name:"Язык программирования Python. Основы языка Python. Линейные программы",href:"\u002Finformatika\u002Fyazyk-programmirovaniya-python-osnovy-yazyka-python",jpg:"jpg\u002F576047"},{id:325172,name:"Использование динамически выделяемой памяти",href:"\u002Finformatika\u002Fispolzovanie-dinamicheski-vydelyaemoy-pamyati-1",jpg:"jpg\u002F325172"},{id:103341,name:I,href:"\u002Finformatika\u002Fustroystvo-personalnogo-kompyutera-3",jpg:"jpg\u002F103341"},{id:304692,name:"Оргтехника и специальность",href:"\u002Finformatika\u002Forgtehnika-i-spetsialnost",jpg:"jpg\u002F304692"},{id:595082,name:"Искусственный интеллект: история развития, понятие, значение, классификация",href:"\u002Finformatika\u002Fiskusstvennyy-intellekt-istoriya-razvitiya-ponyatie-znachenie",jpg:"jpg\u002F595082"},{id:392170,name:"Двумерные массивы",href:"\u002Finformatika\u002Fdvumernye-massivy-11",jpg:"jpg\u002F392170"},{id:200624,name:"Информационные технологии автоматизированного проектирования",href:"\u002Finformatika\u002Finformatsionnye-tehnologii-avtomatizirovannogo-proektirovaniya",jpg:"jpg\u002F200624"},{id:105494,name:"Технологии передачи-2",href:"\u002Finformatika\u002Ftehnologii-peredachi-2",jpg:"jpg\u002F105494"},{id:339357,name:"Інтелектуальний аналіз даних",href:"\u002Finformatika\u002Fntelektualniy-analz-danih",jpg:"jpg\u002F339357"},{id:90501,name:"Базы данных и SQL",href:"\u002Finformatika\u002Fbazy-dannyh-i-sql-20",jpg:"jpg\u002F90501"},{id:302250,name:"Цифровое детство: компетентность и безопасность",href:"\u002Finformatika\u002Ftsifrovoe-detstvo-kompetentnost-i-bezopasnost",jpg:"jpg\u002F302250"},{id:14169,name:"Майкрософт туралы мәлімет",href:"\u002Finformatika\u002Fmaykrosoft-turaly-mlmet",jpg:"jpg\u002F14169"},{id:209133,name:"Относительные, абсолютные и смешанные ссылки",href:"\u002Finformatika\u002Fotnositelnye-absolyutnye-i-smeshannye-ssylki-10",jpg:"jpg\u002F209133"},{id:349434,name:"Декодирование информации",href:"\u002Finformatika\u002Fdekodirovanie-informatsii",jpg:"jpg\u002F349434"},{id:105528,name:I,href:"\u002Finformatika\u002Fustroystvo-personalnogo-kompyutera-5",jpg:"jpg\u002F105528"},{id:393523,name:"Конструктор мультфильмов",href:"\u002Finformatika\u002Fkonstruktor-multfilmov",jpg:"jpg\u002F393523"},{id:352970,name:"RAM, ROM and Virtual memory",href:"\u002Finformatika\u002Fram-rom-and-virtual-memory",jpg:"jpg\u002F352970"},{id:431331,name:"Интерфейс и примитивы",href:"\u002Finformatika\u002Finterfeys-i-primitivy",jpg:"jpg\u002F431331"},{id:383115,name:"Контур. Бухгалтерия. Получение и установка сертификата",href:"\u002Finformatika\u002Fkontur-buhgalteriya-poluchenie-i-ustanovka-sertifikata",jpg:"jpg\u002F383115"},{id:578197,name:"Разработка сайта “Интернет - магазин одежды Dieshh",href:"\u002Finformatika\u002Frazrabotka-sayta-internet-magazin-odezhdy-dieshh",jpg:"jpg\u002F578197"},{id:301868,name:"Разработка требований к ИС. Управление требованиями к ИС",href:"\u002Finformatika\u002Frazrabotka-trebovaniy-k-is-upravlenie-trebovaniyami",jpg:"jpg\u002F301868"},{id:582457,name:"Искусственный интеллект сегодня",href:"\u002Finformatika\u002Fiskusstvennyy-intellekt-segodnya",jpg:"jpg\u002F582457"}],navigation:{next:"\u002Fkulturologiya\u002Fdevushki-rezhissyory-v-sovremennom-kinematografe",next_name:"Девушки-режиссёры в современном кинематографе",prev:"\u002Fpedagogika\u002Fmetod-proekta-v-obuchenii-literature",prev_name:"Метод проекта в обучении литературе"}}},categories:{result:[{id:J,ordering:b,name:"Без категории",pseudoname:"uncategorized"},{id:144,ordering:b,name:"Бизнес",pseudoname:"biznes"},{id:146,ordering:b,name:"Образование",pseudoname:"obrazovanie"},{id:149,ordering:b,name:"Финансы",pseudoname:"finansy"},{id:150,ordering:b,name:"Государство",pseudoname:"gosudarstvo"},{id:152,ordering:b,name:"Спорт",pseudoname:"sport"},{id:154,ordering:b,name:"Армия",pseudoname:"armiya"},{id:156,ordering:b,name:"Культурология",pseudoname:"kulturologiya"},{id:157,ordering:b,name:"Еда и кулинария",pseudoname:"eda-i-kulinariya"},{id:158,ordering:b,name:"Лингвистика",pseudoname:"lingvistika"},{id:163,ordering:b,name:"Черчение",pseudoname:"cherchenie"},{id:164,ordering:b,name:"Физкультура",pseudoname:"fizkultura"},{id:165,ordering:b,name:"ИЗО",pseudoname:"izo"},{id:166,ordering:b,name:"Психология",pseudoname:"psihologiya"},{id:116,ordering:J,name:"Английский язык",pseudoname:"angliyskiy-yazyk"},{id:108,ordering:2,name:"Астрономия",pseudoname:"astronomiya"},{id:104,ordering:3,name:"Алгебра",pseudoname:"algebra"},{id:106,ordering:4,name:"Биология",pseudoname:"biologiya"},{id:142,ordering:5,name:"География",pseudoname:"geografiya"},{id:141,ordering:6,name:"Геометрия",pseudoname:"geometria"},{id:123,ordering:7,name:"Детские презентации",pseudoname:"detskie-prezentatsii"},{id:107,ordering:8,name:G,pseudoname:"informatika"},{id:109,ordering:9,name:"История",pseudoname:"istoriya"},{id:139,ordering:10,name:"Литература",pseudoname:"literatura"},{id:119,ordering:11,name:"Маркетинг",pseudoname:"marketing"},{id:114,ordering:12,name:"Математика",pseudoname:"matematika"},{id:138,ordering:h,name:"Медицина",pseudoname:"medetsina"},{id:118,ordering:H,name:"Менеджмент",pseudoname:"menedzhment"},{id:137,ordering:15,name:"Музыка",pseudoname:"muzyka"},{id:136,ordering:16,name:"МХК",pseudoname:"mhk"},{id:130,ordering:17,name:"Немецкий язык",pseudoname:"nemetskiy-yazyk"},{id:105,ordering:18,name:"ОБЖ",pseudoname:"obzh"},{id:133,ordering:19,name:"Обществознание ",pseudoname:"obshchestvoznanie"},{id:132,ordering:20,name:"Окружающий мир ",pseudoname:"okruzhayushchiy-mir"},{id:131,ordering:21,name:"Педагогика ",pseudoname:"pedagogika"},{id:129,ordering:22,name:"Русский язык",pseudoname:"russkiy-yazyk"},{id:128,ordering:24,name:"Технология",pseudoname:"tehnologiya"},{id:127,ordering:25,name:"Физика",pseudoname:"fizika"},{id:126,ordering:26,name:"Философия",pseudoname:"filosofiya"},{id:125,ordering:27,name:"Химия",pseudoname:"himiya"},{id:124,ordering:29,name:"Экология",pseudoname:"ekologiya"},{id:121,ordering:30,name:"Экономика",pseudoname:"ekonomika"},{id:120,ordering:31,name:"Юриспруденция",pseudoname:"yurisprudentsiya"}]}},state:{},_errors:{},serverRendered:e,config:{public:{SITE_NAME:K,SITE_HOST:"mypreza.com",SITE_LANG:L,API_BASE_URL:"https:\u002F\u002Fmypreza.com\u002Fapi\u002F",pwaManifest:{name:K,short_name:a,description:a,lang:L,start_url:"\u002F?standalone=true",display:"standalone",background_color:k,theme_color:"#000000",icons:[{src:"\u002F_nuxt\u002Ficons\u002F64x64.f2a6e93d.png",type:d,sizes:M,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F64x64.maskable.f2a6e93d.png",type:d,sizes:M,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F120x120.f2a6e93d.png",type:d,sizes:N,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F120x120.maskable.f2a6e93d.png",type:d,sizes:N,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F144x144.f2a6e93d.png",type:d,sizes:O,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F144x144.maskable.f2a6e93d.png",type:d,sizes:O,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F152x152.f2a6e93d.png",type:d,sizes:P,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F152x152.maskable.f2a6e93d.png",type:d,sizes:P,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F192x192.f2a6e93d.png",type:d,sizes:Q,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F192x192.maskable.f2a6e93d.png",type:d,sizes:Q,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F384x384.f2a6e93d.png",type:d,sizes:R,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F384x384.maskable.f2a6e93d.png",type:d,sizes:R,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F512x512.f2a6e93d.png",type:d,sizes:S,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F512x512.maskable.f2a6e93d.png",type:d,sizes:S,purpose:g}]},yandexMetrika:{id:"85004146",metrikaUrl:"https:\u002F\u002Fmc.yandex.ru\u002Fmetrika\u002Ftag.js",accurateTrackBounce:e,childIframe:c,clickmap:c,defer:c,useRuntimeConfig:e,trackHash:c,trackLinks:e,type:b,webvisor:c,triggerEvent:c,consoleLog:e,partytown:c,isDev:c}},app:{baseURL:"\u002F",buildAssetsDir:"\u002F_nuxt\u002F",cdnURL:a}},pinia:{app:{meta:{h1:m,main_text:a,main_title:n,main_description:o,main_keywords:p,main_image:a},app:{logo_image:q,logo_image_width:r,logo_image_height:s,logo_text:a,image_width_full:t,image_width_min:u,recaptcha_key:v,yandex_search:w,ya_context:c,banner_1:a,banner_2:a,banner_3:a,banner_4:a,banner_5:a,banner_6:a,banner_7:a,banner_8:a,banner_9:a,banner_10:a,email:x,footer_before:a,footer:a,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:y,item_images:z,item_images_tag:A,item_words_h3:c,item_words_tag:B,item_words_1:h,routing:C,item_slide_skipping:D,item_download_timeout:j,item_slider_width:E,item_show_pdf:e,item_show_contents:e,item_show_filename:e},colors:{header_text:k,header_bg:i,accent:i}},social:F,token:a}}}}("",0,false,"image\u002Fpng",true,"any","maskable",13,"#d53032",80,"#ffffff","Информационно-технологический модуль. Overflow. Display. Псевдоэлементы 2019","Учебные презентации","Презентации в PowerPoint на разные темы","Презентации, проекты, доклады в PowerPoint на разные темы для учебы","Презентация, на тему, урок, класс, PowerPoint, скачати презентацію, фон, шаблон, доклад, проект.","images\u002Fdata\u002Flogo.png",185,40,720,480,"6LeioWIpAAAAAGqMN4KqMVIkekcMW7fBKHjXCd-a","2503267","[e-mail]","h3a","text","none","h3","category","both",800,"\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","Информатика",14,"Устройство персонального компьютера",1,"Mypreza","ru","64x64","120x120","144x144","152x152","192x192","384x384","512x512")) этом таблица является встроенным элементом и происходит ее обтекание другими элементами, например, текстом.
table определяет, что элемент является блочной таблицей подобно использованию тега

Текст
используется для выделения в тексте цитат. Содержимое контейнера автоматически отображается в браузере в кавычках.
Синтаксис
Текст
quotes устанавливает тип кавычек, который применяется в тексте документа.
Синтаксис
quotes: "левая кавычка" "правая кавычка" | none
2019
ДОПОЛНЕНИЕ

2019

Псевдоэлемент в CSS — это ключевое слово, добавляемое к селектору, которое позволяет стилизовать определённую часть выбранного элемента.
2019
ПСЕВДОЭЛЕМЕНТЫ
Селектор::псевдоэлемент {
свойство: значение;
--------
свойство: значение;
}
Селектор дополнительные теги::псевдоэлемент {
свойство: значение;
--------
свойство: значение;
}

2019
content позволяет вставлять генерируемое содержание в текст веб-страницы, которое первоначально в тексте отсутствует. Применяется совместно с псевдоэлементами :after и :before, они соответственно указывают отображать новое содержимое после или до элемента, к которому добавляются.
Синтаксис
content: строка | attr(параметр) | open-quote | close-quote | no-open-quote | no-close-quote | url | counter | normal | none
Значения
Строка текст, который добавляется на веб-страницу, строка при этом должна браться в двойные или одинарные кавычки. Допускается использовать юникод для вставки спецсимволов. Спецсимволы HTML которые начинаются с амперсанда (§ например), будут отображаться как есть, т.е. простым текстом (§, а не §).

2019
attr(параметр) возвращает строку, которая является значением параметра тега указанного в скобках. Например, a:after {content:attr(href)} добавит после ссылки её адрес, т.е. значение атрибута href. Если указанного атрибута нет, вернется пустая строка.
open-quote вставляет открывающую кавычку, тип которой устанавливается с помощью стилевого свойства quotes.
close-quote вставляет закрывающую кавычку.
no-open-quotes отменяет добавление открывающей кавычки.
no-close-quote отменяет добавление закрывающей кавычки.
url абсолютный или относительный адрес вставляемого объекта. Если указанный файл браузер не может отобразить, то значение игнорируется.
none не добавляет никакое содержание.
normal задается как none для псевдоэлементов ::before и ::after.

2019
::after или :after псевдоэлемент, который используется для вывода желаемого текста после содержимого элемента, к которому он добавляется. Псевдоэлемент ::after работает совместно со свойством content.
Для ::after характерны следующие особенности.
При добавлении ::after к блочному элементу, значение свойства display может быть только: block, inline, none, marker. Все остальные значения будут трактоваться как block.
При добавлении ::after к встроенному элементу, display ограничен значениями inline и none. Все остальные будут восприниматься как inline.
Синтаксис
селектор::after { … } или селектор доп теги::after { … }

2019
::before или :before применяется для отображения желаемого контента до содержимого элемента, к которому он добавляется. Работает совместно со свойством content.
Для ::before характерны следующие особенности. При добавлении ::before к блочному элементу, значение свойства display может быть только: block, inline, none, marker. Все остальные значения будут трактоваться как block. При добавлении ::before к встроенному элементу, display ограничен значениями inline и none. Все остальные будут восприниматься как inline. ::before наследует стиль от элемента, к которому он добавляется.
Синтаксис
селектор::before { … } или селектор доп теги::before { … }

2019
::first-letter или :first-letter определяет стиль первого символа в тексте элемента, к которому добавляется. К этому псевдоэлементу могут применяться только стилевые свойства, связанные со свойствами шрифта, полями, отступами, границами, цветом и фоном.
Синтаксис
селектор::first-letter { ... } или селектор доп теги::first-letter { ... }
::first-line или :first-line задает стиль первой строки форматированного текста. Длина этой строки зависит от многих факторов, таких как используемый шрифт, размер окна браузера, ширина блока, языка и т.д. В правилах стиля допустимо использовать только свойства, относящиеся к шрифту, изменению цвета текста и фона.
Синтаксис
селектор::first-line { ... } или селектор доп теги::first-line { ... }
::selection применяет стиль к выделенному пользователем тексту. В правилах стилей допускается использовать следующие свойства: color, background и background-color.
Синтаксис
селектор::selection { ... } или селектор доп теги::selection { ... }