标签:lock man ext splay att count css3 html cout
我不知道是否有其他人能看见我写的内容,由于我是一个渣渣,很多内容都不知道,所以将这些很简单的东西都记录下来,希望不小心点进来的大神们,能吐槽一下我,呃指点一下我。和我一样的小白们希望能相互学习,谢谢了。
一:使用选择器来插入文字
二: 插入图片文件
将alt属性的值作为图像的标题来显示
如果在content属性中通过“attr(属性名)”的形式来指定attr属性值,可以将某个属性的属性值显现出来,目前只有opera10 对attr属性值提供支持
使用content属性来插入项目编号
在多个标题前加入连续的编号 <元素>:before { content: couter(计数器名);}, 另外还需要在元素的样式中追加元素的counter-increment属性的指定,
为了使用连续编号,需要将counter-increment属性的属性值设置为before选择器或者after选择器的counter属性值中所指的的计数器名。
在项目编号中追加文字
编号嵌套
可以在大编号中嵌套小编号, 在嵌套编号时需要在上一级标题的元素样式中加入counter-reset:下一级计数器名;
中编号嵌入大编号
详见代码
在字符串两边添加嵌套文字符号
可以使用content属性的属性值open-quote,close-quote在字符串两边添加诸如括号,单引号,双引号等嵌套文字符号。
open-quote用于添加开始的嵌套文字符号;close-quote用于添加结尾的嵌套文字符号,另外同样需要在元素的样式表中使用quotes属性来指定使用什么嵌套文字符号。
当需要添加双引号时,需要使用“\”转义字符。
我添加文字字符没成功,不知道原因?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style type="text/css"> h2:before{ content:‘我是加入的文字‘; color:#0C6;} h2.sam:before{ content:none;} /*h2:before{ content:url(wy.gif);} */h2.new:after{ content:url(wy.gif);} /*h1:before{ content: counter(name);} h1{ counter-increment:name; }*/ /*h1:before{ content:‘第‘ counter(name)‘章‘;} h1{ counter-increment:name;}*/ /*h1:before{ content: counter(name, upper-roman)‘.‘; color:blue; font-size:42px;} h1{ counter-increment:name;}*/ /*h1:before{ content: counter(name)‘.‘;} h1{ counter-increment:name;counter-reset:vname;} h3:before{ content:counter(vname)‘.‘; } h3{ counter-increment:vname; margin-left:40px;}*/ /*h1:before{ content: counter(name);} h1{ counter-increment:name;counter-reset:vname;} h3:before{ content:counter(name)‘-‘counter(vname)‘.‘; } h3{ counter-increment:vname; margin-left:40px;counter-reset:vvname;} h4:before{ content:counter(name)‘-‘counter(vname)‘-‘counter(vvname)‘-‘; } h4{ counter-increment:vvname; margin-left:50px;}*/ h1:before{ content:open-quote;} h1{ quotes:"\"";} </style> </head> <body> <h2>标题文字</h2> <h2 class="sam">标题文字2</h2> <h2>标题文字3</h2> <h2 class="new">标题文字三</h2> <h1>大标题</h1> <p>示例文字</p> <h1>大标题</h1> <p>示例文字</p> <h1>大标题</h1> <p>示例文字</p> <h1>大标题</h1> <p>示例文字</p> <div id="mian"> <h1>大标题</h1> <p>示例文字</p> <h1>大标题</h1> <p>示例文字</p> <h1>大标题</h1> <p>示例文字</p> <h1>大标题</h1> <p>示例文字</p> <h1>大标题</h1> <h3>小标题</h3> <h4>小小标题</h4> <h4>小小标题</h4> <h4>小小标题</h4> <h3>小标题</h3> <h4>小小标题</h4> <h4>小小标题</h4> <h4>小小标题</h4> <h3>小标题</h3> <h1>大标题</h1> <h3>小标题</h3> <h3>小标题</h3> <h3>小标题</h3> </div> </body> </html>
——学习HTML5与CSS3权威指南学习笔记20章
标签:lock man ext splay att count css3 html cout
原文地址:http://www.cnblogs.com/cyjy/p/6329547.html