Text-shadow
<! DOCTYPE html>"utf-8"> <title> CSS3 text </title> <style type="text/css"> * { 0 ; 0 ; } H1 { text-shadow:5px 5px 5px red;/*x axis, y-axis, blur degree, color */ }</style>
The effect is as follows:
The CSS3 text Overflow property specifies how the overflow content should be displayed to the user
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"> <title>CSS3 Text effects</title> <styletype= "Text/css"> * {margin:0;padding:0; }div.test{width:12em;White-space:nowrap; /*text appears in one line*/Overflow:Hidden; /*areas beyond the text are hidden*/Border:1px solid #000; }</style></Head><Body> <Divclass= "Test"style= "text-overflow:ellipsis;">This is some a long text that won't fit in the box</Div> <Divclass= "Test">This was some long text that would fit in the box</Div> <Divclass= "Test"style= "Text-overflow: ' >> '">This was some long text that would fit in the box</Div></Body></HTML>
The effect is as follows:
Clip: Default
Ellipsis: Text overflow display ellipsis
Text-overflow: ' >> ': Only available in Firefox browser
css3--text effects