How to change font color in reveal.js?

Question

I try to change the color of the font in just one section because I added a background picture and you cant read the white otherwise:

            <section data-background="media/imagename.jpg">             
                <h2>blablabla</h2>
            </section>

What should I add here to make "blablabla" look black?

Thanks!

Lala

Niello

Answer 1

It's more simple than you can think :

Inline Editing

<section data-background="media/imagename.jpg" *style="color:black"*>             
                <h2>blablabla</h2>
            </section>

or, 2nd option with a .css file

<section id="namediv" data-background="media/imagename.jpg">             
                <h2>blablabla</h2>
            </section>

.css:

#namediv
{
  color:black
}

remember to include the .css file in your html/page. The first one is more fast but very rough to see and to use, the second one is more structured. Remember that you have to adjust the font color based on your background image (blue background white color font etc.etc.)

Obie

be careful that what you wrote is Html, pure simply Html, you will use reveal.js when in js script you will change dynamically your content. – Obie

The first one does not work within reveal.js, because the CSS theme overrides this with a more specific value (i.e. the color for the h2 element is set within the theme css, black.css in my case) – Doukhobor

Answer 2

Additionally, here is an example on how to change font colour when you use markdown for slides

<section data-markdown>
  <script type="text/template">
  <!-- .slide: style="color:white" -->  
    your text in markdown goes here...   

    _Doing is the best form of Saying_  
  </script>
</section>

Hans

Answer 3

The simplest way to do do this is with an inline style attribute, but you need to set it directly on the h2 element to override the theme, i.e. like this:

<section data-background="media/imagename.jpg" >             
   <h2 style="color:black">blablabla</h2>
</section>

Doukhobor