Атрибут src тега <embed> — адреса вбудованого файлу
Атрибут src вказує шлях до файлу, який необхідно завантажити у вікно браузера. Браузер аналізує розширення файлу і вирішує по ньому, який плагін або зовнішня програма потрібна для відображення файлу.
Загальний опис
автор: NagarD
Синтаксис
<embed src="URL">
Атрибут src може отримувати єдине значення:
-
URL -
Вказує адресу зовнішнього файлу, щоб вставляти. Можливі значення:
- Абсолютний URL - вказує на інший сайт (наприклад, href="http://www.example.com/hello.swf")
- Відносний URL - вказує на файл в межах веб-сайту (наприклад, href="hello.swf")
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| 1 | 1 | ≤4 | ≤12.1 | 12 | ≤6 |
| Переглядач | ||||
|---|---|---|---|---|
| 4.4 | 18 | 4 | ≤3.2 |
Приклади
+ запропонувати свій приклад у пісочниці
Чотири вставки поспіль: робочий <embed> із малюнком, <embed> зі зламаною адресою (порожньо, коробки немає взагалі), <object> із такою самою зламаною адресою (видно запасний текст) і <embed>, «всередину» якого написали текст — аналізатор виніс його назовні.
HTML
<p>1. Робочий embed — коробка взяла розмір самого малюнка, 120×60:</p>
<embed src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='120'%20height='60'%3E%3Crect%20width='120'%20height='60'%20fill='%2372b043'/%3E%3Ccircle%20cx='60'%20cy='30'%20r='18'%20fill='%23ffffff'/%3E%3C/svg%3E">
<p>2. embed зі зламаною адресою — між дужками нижче немає нічого, коробка 0×0:</p>
<p class="marks">[<embed src="zlamana-adresa.xyz">]</p>
<p>3. object із такою самою зламаною адресою — показано запасний вміст:</p>
<p class="marks">[<object data="zlamana-adresa.xyz">Ресурс не завантажився — це запасний текст</object>]</p>
<p>4. embed — порожній теґ: текст, написаний «усередині», опинився поруч:</p>
<p class="marks">[<embed src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='60'%20height='30'%3E%3Crect%20width='60'%20height='30'%20fill='%23f2b134'/%3E%3C/svg%3E">цей текст мав бути запасним</embed>]</p>
CSS
p {
margin: 16px 0 6px;
max-width: 560px;
}
embed,
object {
vertical-align: middle;
margin: 0 8px;
outline: 2px dashed #d64545;
outline-offset: 2px;
}
.marks {
padding: 8px 10px;
background: #f6f9ff;
border: 1px solid #b9c6d8;
font-family: ui-monospace, monospace;
font-size: .9em;
color: #5a6472;
}
<p> Приклад використання атрибуту <code> src </code> </p>
<embed id="image" type="image/svg+xml" width="250" height="250" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='250' viewBox='0 0 40 40' preserveAspectRatio='none'%3E%3Crect width='40' height='40' fill='%23264653'/%3E%3Cpath d='M0 40 12 18 22 30 30 22 40 40Z' fill='%232a9d8f'/%3E%3Ccircle cx='30' cy='9' r='5' fill='%23e9c46a'/%3E%3C/svg%3E">
<embed type="image/svg+xml" width="250" height="250" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='250' viewBox='0 0 40 40' preserveAspectRatio='none'%3E%3Crect width='40' height='40' fill='%238a4b0f'/%3E%3Cpath d='M0 40 12 18 22 30 30 22 40 40Z' fill='%23c96f1e'/%3E%3Ccircle cx='30' cy='9' r='5' fill='%23f4a259'/%3E%3C/svg%3E">
Різниця між HTML 4.01 та HTML5
Тег <embed> є новим в HTML5.
Коментарі
Коментарів ще немає — будьте першим!