LINUX.ORG.RU

HTML Indentation


0

0

Как делают правильные чуваки?
1. <pre> </pre>
2. nbsp;nbsp;nbsp; (Пришлось амперсанд убрать, ЛОРовский движок переводит из в пробелы).
3. Как-то ещё?

★★★★★
Ответ на: комментарий от nu11

padding-left: 1em;

Мысль пока не уловил... А если нужно добавить ещё 3, 6... ? На каждый отступ свой стиль?

UVV ★★★★★
() автор топика

а где ты это делаешь?

в тексте ведь обычно отсутпы идут одинакового расстояния от левого края.

stevejobs ★★★★☆
()

маргин и паддинг для этого есть.

name_no ★★
()
Ответ на: комментарий от Deleted

Ещё есть такая штука white-space: pre-wrap; Про поддержку его в IE не скажу — не помню просто.

Deleted
()
Ответ на: комментарий от UVV

> Мысль пока не уловил... А если нужно добавить ещё 3, 6... ? На каждый отступ свой стиль?

один стиль с относительным сдвигом. и делать вложенные дивы.

isden ★★★★★
()
Ответ на: комментарий от isden

один стиль с относительным сдвигом. и делать вложенные дивы.

ага... примерно понял, tnx

UVV ★★★★★
() автор топика

>> Как делают правильные чуваки?

nbsp;nbsp;nbsp;


Тру. Еще как замена align:center прокатывает.

Deleted
()

>Как делают правильные чуваки?

Так от конкретной задачи зависит. Отступы же не как самоцель нужны, а для чего-то. Соответственно, в разных местах - <p>, <blockquote>, <dl>, <pre>. Да и   тоже применим, да.

KRoN73 ★★★★★
()
Ответ на: комментарий от UVV

Форматирование кода.

ИМХО, самое грамотное решение типа такого:

<ol class="code">
<li>&amp;nbsp;int main(void)</li>
<li>&amp;nbsp;{</li>
<li>&amp;nbsp; cout &lt;&lt; "Hello!";</li>
<li>&amp;nbsp; if(argc < 1)</li>
<li>&amp;nbsp; {</li>
<li>&amp;nbsp; &amp;nbsp;exit(0);</li>
<li>&amp;nbsp; }</li>
<li>&amp;nbsp;}</li>
</ol>

KRoN73 ★★★★★
()
Ответ на: комментарий от KRoN73

Т.е. ты тоже склоняешься к nbps?
Я сначала так и собирался делать, видимо, так и придётся, потому как компонент, в котором производится отображение, не понимает em в padding-left, только px.

UVV ★★★★★
() автор топика

Хотя проще всего окружить весь код в <pre>, просто меня смутило вот это:
The PRE element tells visual user agents that the enclosed text is «preformatted». When handling preformatted text, visual user agents:

* May leave white space intact.
* May render text with a fixed-pitch font.
* May disable automatic word wrap.

Как бы в пунктах 1 и 3 не устраивает слово _May_.
Или сильно докапываюсь?

UVV ★★★★★
() автор топика
Ответ на: комментарий от isden

да возьми какой готовый хайлайтер и не парься излишне

Нет, такое решение мне не подойдёт.

UVV ★★★★★
() автор топика
Ответ на: комментарий от UVV

Всё-таки остановлюсь на pre, самое простое решение. А в text-based броузерах это точно не будут просматривать.

UVV ★★★★★
() автор топика
Ответ на: комментарий от UVV

>Т.е. ты тоже склоняешься к nbps?

Да, в общем случае это проще и нагляднее, чем отступы.

Ну а нумерацию строк - однозначно через ol делать. Убивают хайлайтеры, в которых при копипасте номера строк выделяются :)

...

Правда, я самописанием не заморачиваюсь, юзаю готовые решения. Когда-то - colorer, сегодня - geshi.

KRoN73 ★★★★★
()
Ответ на: комментарий от UVV

>Хотя проще всего окружить весь код в <pre>

А, пардон, я не понял, что тебе не нужна синтаксическая подсветка. Просто, когда говорят не о преформатированном тексте, а именно о коде, то обычно подсветка сразу вспоминается :)

...

Если просто преформатированный текст - то однозначно или <pre>, или <xmp> - они для этого и предназначены.

KRoN73 ★★★★★
()
Ответ на: комментарий от KRoN73

А, пардон, я не понял, что тебе не нужна синтаксическая подсветка. Просто, когда говорят не о преформатированном тексте, а именно о коде, то обычно подсветка сразу вспоминается :)

Нет, подсветка нужна. Но я её формирую с помощью css.

UVV ★★★★★
() автор топика
Ответ на: комментарий от UVV

>Нет, подсветка нужна.

Тогда <pre> - это плохо. В нём нельзя сделать автонумерацию строк, как в упорядоченном списке. Придётся прописывать ручками. При копипасте потом пользователи будут страшно материться, вычищая номера строк :)

Но отступ лучше делать в случае кода, действительно, через CSS. Я не подумал. При копипасте &nbsp; скопируется как неразрывный пробел. Большинство трансляторов такое не потерпят. Придётся делать после вставки замену неразрывных пробелов простыми.

KRoN73 ★★★★★
()
Ответ на: комментарий от UVV

>Так, нумерация строк будет не нужна.

Зря ;)

В этом случае отступы с pre нормально? =)


Тогда - да. Всё копироваться будет нормально.

KRoN73 ★★★★★
()
Ответ на: комментарий от KRoN73

Так, нумерация строк будет не нужна.

Зря ;)

Задача другая немного. Вряд ли номера строк понадобятся. =)

UVV ★★★★★
() автор топика
Ответ на: комментарий от KRoN73

> Убивают хайлайтеры, в которых при копипасте номера строк выделяются :)


в нормалных хайлайтерах есть кнопки «Copy» и «View as a plain text» :)

isden ★★★★★
()
Ответ на: комментарий от isden

>в нормалных хайлайтерах есть кнопки «Copy» и «View as a plain text» :)

А такие уже слишком громоздко смотрятся :) Кроме того, «copy» не работает в новых флешах. Безопасность, блин! :)

KRoN73 ★★★★★
()
Ответ на: комментарий от KRoN73

> Кроме того, «copy» не работает в новых флешах. Безопасность, блин! :)

по приведенной мной выше ссылке, хайлайтер полностью на JS, никаких этих ваших флешей и прочей ереси :)

isden ★★★★★
()
Ответ на: комментарий от isden

>хайлайтер полностью на JS

Чур меня, чур... Это будет или страшный монстр с мегабайтным кодом, или убожество, раскрашивающее пару-тройку языков :) ... Ну да, глянул - урезанная поддержка 11 языков на 37кбайт сжатого JS :) Это скучно :D

никаких этих ваших флешей


А ты сам-то его пробовал? Что такое, по-твоему, clipboard.swf в его архиве? :) Из JS нельзя скопировать в буфер обмена. Во флеше по 9-й было можно. В 10 запретили.

KRoN73 ★★★★★
()
Ответ на: комментарий от KRoN73

>урезанная поддержка 11 языков

Да, просто до кучи, в упомянутом выше geshi у меня сейчас подсвечивается 178 языков :) При чём, скажем, для того же PHP - все его функции, один список которых почти на 70кбайт тянет :) На многих языках функции и операторы содержат ссылки на онлайн-хелп на сайте поставщика.

На этом фоне упомянутый тобой JS как-то вяло выглядит :)

KRoN73 ★★★★★
()
Ответ на: комментарий от KRoN73
$ ls
4cs.php            gnuplot.php        pf.php
abap.php           groovy.php         php-brief.php
actionscript3.php  gwbasic.php        php.php
actionscript.php   haskell.php        pic16.php
ada.php            hicest.php         pike.php
apache.php         hq9plus.php        pixelbender.php
applescript.php    html4strict.php    plsql.php
apt_sources.php    icon.php           postgresql.php
asm.php            idl.php            povray.php
asp.php            ini.php            powerbuilder.php
autoconf.php       inno.php           powershell.php
autohotkey.php     intercal.php       progress.php
autoit.php         io.php             prolog.php
avisynth.php       java5.php          properties.php
awk.php            java.php           providex.php
bash.php           javascript.php     purebasic.php
basic4gl.php       j.php              python.php
bf.php             jquery.php         qbasic.php
bibtex.php         kixtart.php        q.php
blitzbasic.php     klonec.php         rails.php
bnf.php            klonecpp.php       rebol.php
boo.php            latex.php          reg.php
caddcl.php         lisp.php           robots.php
cadlisp.php        locobasic.php      rpmspec.php
cfdg.php           logtalk.php        rsplus.php
cfm.php            lolcode.php        ruby.php
chaiscript.php     lotusformulas.php  sas.php
cil.php            lotusscript.php    scala.php
clojure.php        lscript.php        scheme.php
c_mac.php          lsl2.php           scilab.php
cmake.php          lua.php            sdlbasic.php
cobol.php          m68k.php           smalltalk.php
c.php              magiksf.php        smarty.php
cpp.php            make.php           sql.php
cpp-qt.php         mapbasic.php       systemverilog.php
csharp.php         matlab.php         tcl.php
css.php            mirc.php           teraterm.php
cuesheet.php       mmix.php           text.php
dcs.php            modula2.php        thinbasic.php
delphi.php         modula3.php        tsql.php
diff.php           mpasm.php          typoscript.php
div.php            mxml.php           unicon.php
dos.php            mysql.php          vala.php
dot.php            nemerle.php        vbnet.php
d.php              newlisp.php        vb.php
ecmascript.php     nsis.php           verilog.php
eiffel.php         oberon2.php        vhdl.php
email.php          objc.php           vim.php
erlang.php         ocaml-brief.php    visualfoxpro.php
fo.php             ocaml.php          visualprolog.php
fortran.php        oobas.php          whitespace.php
freebasic.php      oracle11.php       whois.php
fsharp.php         oracle8.php        winbatch.php
gambas.php         oxygene.php        xbasic.php
gdb.php            oz.php             xml.php
genero.php         pascal.php         xorg_conf.php
genie.php          pcre.php           xpp.php
gettext.php        perl6.php          z80.php
glsl.php           perl.php
gml.php            per.php

:)

KRoN73 ★★★★★
()
Ответ на: комментарий от UVV

Нужного мне таки нет =)

Там пишется на раз :)

$language_data = array (
    'LANG_NAME' => 'Scala',
    'COMMENT_SINGLE' => array(1 => '//'),
    'COMMENT_MULTI' => array('/*' => '*/'),
    'CASE_KEYWORDS' => GESHI_CAPS_NO_CHANGE,
    'QUOTEMARKS' => array("'", '"'),
    'ESCAPE_CHAR' => '\\',
    'KEYWORDS' => array(
        1 => array(
            'abstract', 'case', 'catch', 'class', 'def',
            'do', 'else', 'extends', 'false', 'final',
            'finally', 'for', 'forSome', 'if', 'implicit',
            'import', 'match', 'new', 'null', 'object',
            'override', 'package', 'private', 'protected', 'requires',
            'return', 'sealed', 'super', 'this', 'throw',
            'trait', 'try', 'true', 'type', 'val',
            'var', 'while', 'with', 'yield'
            ),
        2 => array(
            'void', 'double', 'int', 'boolean', 'byte', 'short', 'long', 'char', 'float'
            )
        ),
    'SYMBOLS' => array(
        '(', ')', '[', ']', '{', '}', '*', '&', '%', '!', ';', '<', '>', '?',
        '_', ':', '=', '=>', '<<:',
        '<%', '>:', '#', '@'
        ),
    'CASE_SENSITIVE' => array(
        GESHI_COMMENTS => false,
        1 => true,
        2 => true
        ),
    'STYLES' => array(
        'KEYWORDS' => array(
...

KRoN73 ★★★★★
()
Ответ на: комментарий от KRoN73

Да не, я так, чтобы беседу поддержать =)
Мне будет достаточно HTML + CSS.

UVV ★★★★★
() автор топика
Ответ на: комментарий от UVV

>Мысль пока не уловил... А если нужно добавить ещё 3, 6... ? На каждый отступ свой стиль?

То ты делаешь <li style=«margin-left: <size * level>em;»>...</li>, где внутри <> есть код твоего темплейтера/языка итд. Приятнее чем nbsp, имхо

anonymous
()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.