HTML DOM content attribute

Definition and usage

The content attribute sets where the text or image appears (floating) within another element.

Syntax:

Object.style.content=value

Possible values

Value Description
string Define the text content.
url Define the URL.
  • counter(name)
  • counter(name, list-style-type)
  • counters(name, string)
  • counters(name, string, list-style-type)
 
attr(X) Define the properties of the selector that is displayed before or after the current selector.
open-quote  
close-quote  
no-open-quote  
no-close-quote  

Tips and comments

Comments:If there is not enough space in a line for a floating element, then this element will jump to the next line, and this process will continue until there is enough space in a line.

Comments:The content, background, and border of inline elements should appear before floating elements. The background and border of block-level elements should appear after floating elements, but the content of block-level elements should be in front of floating elements.

Example

This example sets the image to float on the left:

<html>
<head>
<script type="text/javascript">
function setFloatLeft()
{
document.getElementById("img1").style.cssFloat="left";
}
</script>
</head>
<body>
<img id="img1" src="logocss.gif" width="95" height="84" />
<p>This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>
<form>
<input type="button" onclick="setFloatLeft()" value="Set image to float left" />
</form>
</body>
</html>