Ако сте икада погледали списак ХТМЛ елемената, можда сте наишли на питање "шта је блокотека?" Елемент блоккоте је ХТМЛ таг пар који се користи за дефинисање дугих цитата. Ево дефиниције овог елемента према В3Ц ХТМЛ5 спецификацији:
Елемент блоккота представља одељак који је цитиран из другог извора.
Како користити Блоцккуоте на својим веб страницама
Када пишете текст на веб страници и креирате изглед странице, понекад желите да позовете блок текста као цитат.
Ово би могао бити цитат из нечега другог, као што је исказ купца који прати студију случаја или прича о успеху пројекта. Ово такође може бити дизајн третмана који понавља неки важан текст из самог чланка или садржаја. У објављивању, ово се понекад назива и пулл-куоте , У веб дизајну, један од начина за постизање овога (и начин који покривамо у овом чланку) назива се блокотом.
Дакле, погледајмо како бисте користили ознаку блоккота да бисте дефинирали дугачке цитате, као што је овај одломак из "Тхе Јаббервоцки" Левиса Царролла:
"Твас бриллиг и слитхеи товес
Да ли је гировао и претрчао у вабе:
Сви мимици били су боровци,
И мум ритује.
(би Левис Царролл)
Пример коришћења ознаке блокирања
Ознака блоцккуоте је семантичка ознака која говори прегледачу или корисничком агенту да је садржај дугачак цитат. Као такво, не би требало да приложите текст који није цитат унутар блок-бележнице. Запамтите, "цитат" је често актуелне речи које је неко рекао или текст из вањског извора (попут Левис Царролл текста у овом чланку), али то може бити и пуллкуоте концепт који смо претходно покривали.
Кад размислите о томе, тај пуллкуоте је цитат текста, само се чини да је из истог чланка у коме се појављује цитат.
Већина веб претраживача додају неку удаљавање (око 5 места) на обе стране блокотеке како би се издвојила из околног текста. Неки изузетно старији претраживачи могу чак и учинити цитирани текст курзивом.
Запамтите да је ово једноставно подразумевани стил блоккотовог елемента. Са ЦСС-ом, имате потпуну контролу над приказом ваше блокоте. Можете повећати или чак уклонити индент, додати боје позадине или повећати величину текста како бисте додатно позвали цитат. Можете да плутате тај цитат са једне стране странице и замените други текст, што је уобичајено визуелни стил који се користи за пуллкуотес у штампаним часописима. Имате контролу над појавом блокаде са ЦСС-ом, нешто о чему ћемо разговарати мало кратко. За сада, наставимо да гледамо како да додате сам цитат у ХТМЛ ознаку.
Да бисте у текст додали ознаку блокаде, једноставно окружите текст који је цитат са следећим пар тагом -
На пример:
"Твас бриллиг и слитхеи товес
Да ли је гировао и претрчао у вабе:
Сви мимици били су боровци,
И мум ритује.
Као што можете видети, једноставно додате пар блокова ознака око садржаја самог цитата. У овом примеру користили смо и неке ознаке (
) да додате појединачне преломове где је то одговарајуће унутар текста. То је зато што преобликавамо текст из песме, где су те специфичне паузе важне. Ако сте креирали цјеновник за свједочанство, а линије нису требале провалити одређене дијелове, не бисте желели да додате ове ознаке паузе и омогућите самом претраживачу да преклопи и разбије по потреби на основу величине екрана.
Не користите блоккуоте у тексту индентирања
Годинама су људи користили блоковску ознаку ако желе да унесу текст на своју веб страницу, чак и ако тај текст није био пуллкуоте. Ово је лоша пракса! Не желите да користите семантику блокотека искључиво из визуелних разлога. Ако желите да унесете свој текст, требало би да користите табеле стилова, а не ознаке за блокирање (осим ако, наравно, оно што покушавате да унесете је цитат!). Покушајте да ставите овај код на своју веб страницу ако покушавате једноставно додати индент:
Ово ће бити текст који је раздвојен.
Затим бисте циљали ту класу ЦСС стилом
.индентед {
паддинг: 0 10пк;
}
Ово додаје 10 пиксела подлоге на обе стране параграфа.
Оригинални чланак Јеннифер Кринин. Уредио Јереми Гирард на 5/8/17.