Nick Dokos <nicholas.do...@hp.com> writes: > Robert Pluim <rpl...@gmail.com> wrote: > >> (I thought this would be a FAQ, but I can't find anything similar) >> >> Hi, >> >> I'm exporting from org to html, which is working well. Since my final >> target is MSWord, I'd like to add style information to various >> paragraphs, ie bold, underline etc. I can see how to do eg *bold* for >> individual words, but how do I apply that kind of formatting to a span >> of text? >> >> (I'm CSS-ignorant, so please use small words and talk slowly) >> > > Reading section 12.5.8, "CSS support", and experimenting a bit, > I came up with a short example that I hope will clarify that section > for the CSS-ignorant (which I mostly am): > > #+OPTIONS: ^:nil > #+STYLE: <style type=text/css> .bold {color: red;} </style> > #+STYLE: <style type=text/css> .inner {color: blue;} </style> > > * Headline > :PROPERTIES: > :HTML_CONTAINER_CLASS: bold > :END: > This is a bold section. This is done by using the HTML_CONTAINER_CLASS > property of the subtree and giving it the value bold, then setting the > style for class _bold_ to accomplish the desired goal. > > But you can selectively > #+HTML: <span class="inner"> > change some things like this > #+HTML: </span> > if you want.
or like this: --8<---------------cut here---------------start------------->8--- @<span class="inner"> change some things like this @</span> --8<---------------cut here---------------end--------------->8--- Note the "at"s preceding the html tags. > > Here is what I know about CSS (but take it with the appropriate grain > of salt - as I said, I'm mostly CSS-ignorant): > > The thing to remember is that you can add <span>...</span> to delimit > HTML inline elements and <div>...</div> for HTML block elements. > > Each can be given a class: <span class="foo">...</span> or an id: > <span id="bar">...</span>. Classes are hierarchical, ids are targeted. > > In the style definitions, you write > > .foo { style info; ...} > > for classes and > > #bar {style info; ...} > > for ids. > > So you can use #+HTML: ... to add spans or divs at the appropriate > places, giving them a class or id as you see fit, and then add #+STYLE: > definitions at the top to style them. > > Be careful when typing: the slightest error will cause the browser to just > ignore whole swaths of styling, which makes debugging ... interesting. > I tend to edit the html file one tiny thing at a time and redisplaying. When > I've figured out what's wrong, I go back to the org file and try the result. > > Nick > > --