Уценка и выравнивание изображения - PullRequest
158 голосов
/ 01 ноября 2008

Я делаю сайт, который публикует статьи в выпусках каждый месяц. Это просто, и я думаю, что использование редактора Markdown (такого как WMD здесь в Stack Overflow) было бы идеально.

Однако, им нужна возможность выравнивать изображения по правому краю в данном абзаце .

Я не вижу способа сделать это с текущей системой - возможно ли это?

Ответы [ 13 ]

2 голосов
/ 04 мая 2013

Как сказал Грег , вы можете встраивать HTML-контент в Markdown, но один из пунктов Markdown - избегать необходимости иметь обширные (или, если на то пошло) знания CSS / HTML-разметки, верно? Вот что я делаю:

В моем файле Markdown я просто приказываю всем моим редакторам вики вставлять, чтобы обернуть все изображения чем-то, похожим на это:

'<div> // Put image here  </div>`

(конечно .. они не знают, что означает <div>, но это не должно иметь значения)

Итак, файл Markdown выглядит так:

<div>
![optional image description][1]
</div>

[1]: /image/path

И в контенте CSS, который охватывает всю страницу, я могу делать с тегом image все, что захочу:

img {
   float: right;
}

Конечно, вы можете сделать больше с контентом CSS ... (в данном конкретном случае обтекание тега img с помощью div предотвращает наложение другого текста на изображение ... это всего лишь пример), но ИМХО смысл Markdown в том, что вы не хотите, чтобы потенциально нетехнические люди вникали в тонкости CSS / HTML ... вы, как веб-разработчик, должны сделать свой CSS-контент таким, чтобы оборачивает страницу как можно более общей и чистой, но опять же ваши редакторы не должны знать об этом.

1 голос
/ 09 февраля 2018

У меня была та же задача, и я выровнял свои изображения по правому краю, добавив следующее:

<div style="text-align: right"><img src="/default/image/sms.png" width="100" /></div>

Для выравнивания изображения по левому краю или по центру замените

<div style="text-align: right">

с

<div style="text-align: center">
<div style="text-align: left">
0 голосов
/ 13 декабря 2011

Самое простое - обернуть изображение в центральную метку, например ...

<center>![Alt test](http://upload.wikimedia.org/wikipedia/en/b/bc/Wiki.png)</center>

Здесь можно проверить все, что связано с Markdown - http://daringfireball.net/projects/markdown/dingus

Конечно, <center> может быть устаревшим, но это просто и работает!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...