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