Proprietatea CSS content se foloseste pentru a genera continut intr-un element HTML direct din CSS. Poate fi utilizata cu pseudo-elementele :after si :before.

<style>
.cnt_ex1:before {
 content: '~> ';
 color: #0000d0;
}

.cnt_ex1:after {
 content: ' <~';
 color: #0000d0;
}
</style>

<div class='cnt_ex1'>CoursesWeb.net</div>
<div class='cnt_ex1'>MarPlo.net</div>

Elementul <style> din aceste exemple se adauga in sectiunea <head> din pagina.


Valori pentru CSS content


Alte exemple cu proprietatea content

Modificare marcator de la liste

- Urmatorul exemplu afisaza simbolul ( » ) ca marcator la listele din <ul> care are clasa 'li_mark1':
<style>
ul.li_mark1 { list-style: none; }
ul.li_mark1 li:before {
 content: '\00BB'; /* Escaped Hex code notation */
 padding-right: 8px;
}
</style>

<ul class='li_mark1'>
 <li>Free Courses and Tutorials</li>
 <li>HTML-CSS examples</li>
 <li>Today is a good day for "Doing" Nothing</li>
</ul>
Demo:

Rand nou in css content

Ca sa adaugati un text cu mai multe linii in proprietatea "content", adaugati in textul respectiv: \a unde vreti crearea unui nou rand, si proprietatea white-space: pre;
<style>
#cnt_ex4:after {
 color:#0000e0;
 content: '- Text from content \a Another line.';
 white-space: pre;
}
</style>
<div id='cnt_ex4'>HTML Div.</div>
Demo:
HTML Div.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce atribut poate fi utilizat pentru a adauga stiluri CSS direct in tag-ul HTML?
type style class
<div style="width: 80%; border: 3px solid #888888;">Continut</div>
Care din metodele proprietatii CSS transform distorsioneaza elementul HTML la un anumit unghi (inclusiv continutul lui)?
translate() scale() skew()
#un_id {
  transform: skew(20deg, 25deg);
  -ms-transform: skew(20deg, 25deg);   /* IE 9 */
  -webkit-transform: skew(20deg, 25deg);   /* Safari and Chrome */
}
Clic pe functia care poate converti un obiect Date in Sir.
indexOf() toString() getDate()
var rightnow = new Date();
alert( rightnow.toString() );
Care functie aplica o alta functie la elementele unui array?
array_merge() array_search() array_map()
$arr = arra("abc", "<p>xyz</p>", "<em>PHP</em>");
// aplica functia strip_tags() ca sa stearga tag-urile HTML din fiecare element din %arr
$arr = array_map("strip_tags", $arr);
}
Cum se spune "sambata" in limba engleza?
Sunday Saturday Monday
On Saturday I visit my grandparents.
- Sambata imi vizitez bunicii.
Cum se spune "sambata" in limba spaniola?
domingo lunes sábado
Sábado visito mis abuelos.
- Sambata imi vizitez bunicii.
CSS Content

Last accessed pages

  1. Verbe frazale din limba Engleza (9344)
  2. Gramatica limbii engleze - Prezentare Generala (61834)
  3. Trecutul simplu si continuu - Past Tense Simple and Continuous (22365)
  4. Verbe modale - Modal verbs - CAN, COULD, MAY, MIGHT, MUST (18286)
  5. Diferenta dintre Like si As (2868)

Popular pages this month

  1. Gramatica limbii engleze - Prezentare Generala (1611)
  2. Prezentul simplu si continuu - Present Tense Simple and Continuous (985)
  3. Cursuri si Tutoriale: Spaniola, Engleza, HTML, CSS, Php-Mysql, JavaScript, Ajax (758)
  4. Trecutul simplu si continuu - Past Tense Simple and Continuous (736)
  5. Prezent perfect si Prezent perfect continuu - Present perfect and Continuous (714)