CSS content property is used to generate content in an element. It can only be used with the pseudo elements :after and :before.

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

.cnt_ex1:after {
 content: ' <~';
 color: #0000d0;

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

The <style> element from these examples must be added in the <head> section of the page.

CSS content Values

Other examples with content property

Change list-item marker

- The following example displays this symbol ( ยป ) as list-item marker in <ul> elements with class of 'li_mark1':
ul.li_mark1 { list-style: none; }
ul.li_mark1 li:before {
 content: '\00BB'; /* Escaped Hex code notation */
 padding-right: 8px;

<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>

New line in css content

To add a text in "content" property that contains new lines, add in string: \a for linebreak character, and white-space: pre;
#cnt_ex4:after {
 content: '- Text from content \a Another line.';
 white-space: pre;
<div id='cnt_ex4'>HTML Div.</div>

Daily Test with Code Example

Which meta tag provides a short description of the page?
<meta content="..."> <meta description="..."> <meta http-equiv="...">
<meta name="description" content="70-160 characters that describes the content of the page" />
Which CSS property is used to stop the wrapping effect of the "float"?
clear text-align position
#some_id {
  clear: both;
Click on the method which gets an array with all the elements in the document that have a specified tag name.
getElementsByName() getElementById() getElementsByTagName()
var divs = document.getElementsByTagName("div");
var nr_divs = divs.length;
Indicate the PHP function which returns the number of elements in array.
is_[) count() strlen()
$arr =[7, 8, "abc", 10);
$nri = count($arr);
echo $nri;        // 4
CSS Content

Last accessed pages

  1. HTML Course - Free Lessons (11042)
  2. Register and show online users and visitors (22722)
  3. Pagination Class - Script to paginate content (1618)
  4. PHP PDO - exec (INSERT, UPDATE, DELETE) MySQL (41518)
  5. The Stage, Panels and Tools in Flash (6329)

Popular pages this month

  1. Read Excel file data in PHP - PhpExcelReader (341)
  2. PhpSpreadsheet - Read, Write Excel and LibreOffice Calc files (281)
  3. Register and show online users and visitors (264)
  4. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (258)
  5. Insert, Select and Update NULL value in MySQL (162)