Краткая памятка по html-тегам
Jan. 12th, 2026 12:25 pm![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
swet_ka posting in ![[community profile]](https://www.dreamwidth.org/img/silk/identity/community.png){kind=small}
ru_knitting_dwПростите те, кто уже читал этот пост в моих дневниках (тут или в ЖЖ), но мы с Аней подумали, что здесь, в сообществе, он тоже может пригодиться (да, я ж дописала про индексы, так что что-то новенькое в нём есть ;))
Зашел тут недавно разговор о том, что на Дриме, в отличии от ЖЖ, неудобно вставлять картинки.
Тут (на Дриме), в принципе как и там (в ЖЖ), есть две формы написания постов: "html" и "Rich Text" ("Visual editor" в ЖЖ). Но тут, в отличии от там, во вкладке html нет удобных кнопочек, которые сами подставляют теги.
Визуальный же редактор вещь, местами, странная, я и сама его не очень люблю.
Так что я сделала свою версию памятки (теги можно просто скопировать, подставив свои значения).
Совсем кратенько и только о самом, как мне кажется, необходимом (возможно, будет пополняться если я вспомню о чём-то на мой взгляд интересном/полезном).
Зашел тут недавно разговор о том, что на Дриме, в отличии от ЖЖ, неудобно вставлять картинки.
Тут (на Дриме), в принципе как и там (в ЖЖ), есть две формы написания постов: "html" и "Rich Text" ("Visual editor" в ЖЖ). Но тут, в отличии от там, во вкладке html нет удобных кнопочек, которые сами подставляют теги.
Визуальный же редактор вещь, местами, странная, я и сама его не очень люблю.
Так что я сделала свою версию памятки (теги можно просто скопировать, подставив свои значения).
Совсем кратенько и только о самом, как мне кажется, необходимом (возможно, будет пополняться если я вспомню о чём-то на мой взгляд интересном/полезном).
| Как вставить фото |
| ССЫЛКА - вместо слова сюда нужно скопировать ссылку на изображение (не на страницу фотохостинга, а непосредственно на фото!) Проверить правильность ссылки можно просто скопировав её в строку браузера, должно открыться непосредственно фото, ничего больше быть не должно. ШИРИНА - вместо слова нужно написать желаемую ширину картинки в пикселях (100, 300, 800 и т.п.), высота подстроится пропорционально |
| Просто фото, как оно есть на фотохостинге <img src="ССЫЛКА"/> |
| Уменьшенное фото <img src="ССЫЛКА" width="ШИРИНА"/> |
| Превью с возможностью открыть полноразмерное фото <a href="ССЫЛКА"><img src="ССЫЛКА" width="ШИРИНА"/></a> |
| Как установить кат |
| ПодКат - соответственно, всё то, что убираем под кат (текст, картинки и прочее) Пояснение - тут можно написать о том, что находится под катом |
| Cкрытый кусок поста, по умолчанию будет написано "Read more..." <cut>ПодКат</cut> |
| Cкрытый кусок поста с указанием того, что находится под катом <cut text="Пояснение">ПодКат</cut> |
| Как вставить ссылку |
| ССЫЛКА - то, на что ссылаемся Описание - можно описать словами то, что находится по данной ссылке |
| Текст ссылки отображается целиком, как в строке браузера <a href="ССЫЛКА">ССЫЛКА</a> |
| Текст ссылки заменён на завлекательную надпись <a href="ССЫЛКА">Описание</a> |
| Как сделать сноски/индексы |
| Текст - то слово, вверху/внизу которого должен быть индекс/сноска Индекс - то, что будет мелким шрифтом написано сверху или снизу |
| Верхний индекс, пример: ТекстИндекс Текст<sup>Индекс</sup> |
| Нижний индекс, пример: ТекстИндекс Текст<sub>Индекс</sub> |
| Как оформить списки |
| СТРОКА1, СТРОКА2, СТРОКА3 - строки списка (строк может быть больше или меньше, три взяты для примера) |
| Нумерованный список <ol><li>СТРОКА1</li><li>СТРОКА2</li><li>СТРОКА3</li></ol> |
| Ненумерованный список <ul><li>СТРОКА1</li><li>СТРОКА2</li><li>СТРОКА3</li></ul> |
| Как отформатировать текст |
| ТЕКСТ - то, что нужно выделить форматированием |
| Курсив: пример <i>ТЕКСТ</i> |
| Жирный: пример <b>ТЕКСТ</b> |
| Подчеркнутый: пример <u>ТЕКСТ</u> |
| Зачеркнутый: <s>ТЕКСТ</s> |
| Как отделить блоки текста |
| Прямая линия на всю ширину поста <hr> |
| Переход на следующую строку <br> |
no subject
Date: 2026-01-12 12:52 pm (UTC)В жж это все вручную так давно было, что уже трудно вспомнить :)
no subject
Date: 2026-01-12 03:56 pm (UTC)В принципе, тут можно при наборе поста переключиться во вкладку "Rich Text" и пользоваться кнопочками тегов.
Потом переключиться в html, проверить что получилось и убрать лишнее (если вдруг оно появилось).
Но мне проще так :)
no subject
Date: 2026-01-13 05:48 am (UTC)Я все думаю куда фотки размещать, тут же только ссылкой можно, если я правильно поняла
no subject
Date: 2026-01-13 08:36 am (UTC)no subject
Date: 2026-01-13 09:53 am (UTC)no subject
Date: 2026-01-13 12:50 pm (UTC)При загрузке фотографий можно давать им имена, при наведении мышки они будут показываться :)
Инфу о фото можно менять, можно закрывать/открывать доступ к фото (для всех, для избранных, для себя).
Фото его можно вставить в двух видах, как есть или превью.
После загрузки выбрать " View all your images", откроется страница: https://www.dreamwidth.org/file/list
Там можно либо скопировать код из верхнего окошка (Image Embed:), получится изображение того размера, который загружали.
Либо возле нижнего бокса (Thumbnail Embed:) выбрать желаемый размер и скопировать код, получится превью.
no subject
Date: 2026-01-12 01:52 pm (UTC)no subject
Date: 2026-01-12 03:57 pm (UTC)no subject
Date: 2026-01-12 03:49 pm (UTC)no subject
Date: 2026-01-12 03:57 pm (UTC)no subject
Date: 2026-01-12 04:01 pm (UTC)no subject
Date: 2026-01-13 10:32 am (UTC)Надо будет детям показать.