css3在页面中插入内容

A 使用选择器来插入内容

h2:before{

  content:"前缀";

}

h2:after{

  content:"后缀";

}

B 指定个别的元素不进行插入

h2.sample:before{

  content:none;

}

2. 插入图像

A 在标题前插入图像文件

h2:before{

  content:url(anwy.jpg);

}

B alt属性的值作为图像的标题来显示(用不了)

img:after{

  content:attr(alt);

  display:block;

  text-align:center;

  margin-top:5px;

  font-size:11px;

  font-weight:bold;

  color:black;

}

3. 插入编号

A 多个标题前加入连续编号

div:before{

  content:counter(divCounter);

}

div{

  counter-increment:divCounter;

}

B 在项目符号中追加文字

div:before{

  content:"第"counter(divCounter)"段";

}

C 指定编号样式、种类

div:before{

  content:counter(divCounter,upper-alpha)‘.‘;

  color:blue;

  font-size:16px;

}

D 编号嵌套

div:before{

  content:counter(divCounter,upper-alpha)‘.‘;

  color:blue;

  font-size:16px;

}

div{

  counter-increment:divCounter;

  counter-reset:subDivCounter;

}

p:before{

  content:counter(subDivCounter)‘.‘;

  margin-left:15px;

  font-size:12px;

}

p{

  counter-increment:subDivCounter;

}

E 字符串两边添加文字嵌套符号

h3:before{

  content: open-quote;

}

h3:after{

  content: close-quote;

}

h3{

  quotes:"【""】";

}

disc 点| circle圆圈 | square正方形 | decimal数字 | decimal-leading-zero 十进制数| lower-roman 小写罗马文字| upper-roman 大写罗马文字| lower-greek小写希腊字母 | lower-latin小写拉丁文 | upper-latin 大写拉丁文| armenian亚美尼亚数字 | georgian乔治亚数字 | lower-alpha小写英文字母 | upper-alpha大写英文字母 | none无 | inherit继承

时间: 2024-11-04 14:17:50

css3在页面中插入内容的相关文章

使用选择器在页面中插入内容

我不知道是否有其他人能看见我写的内容,由于我是一个渣渣,很多内容都不知道,所以将这些很简单的东西都记录下来,希望不小心点进来的大神们,能吐槽一下我,呃指点一下我.和我一样的小白们希望能相互学习,谢谢了. 在css中可以使用before伪元素选择器 after伪元素选择器在页面中插入内容,而插入的内容由content属性来定义     一:使用选择器来插入文字 使用选择器来插入文字,在插入的内容是文字时要在文字的两旁加入单引号或者双引号. 为了使插入的内容美观,可以在选择器中加入添加的内容的样式

CSS3 生成内容(在Web中插入内容)

在Web中插入内容,在CSS2.1时代依靠的是JavaScript来实现.但进入CSS3进代之后我们可以通 过CSS3的伪类“:before”,“:after”和CSS3的伪元素“::before”.“::after”来实现,其关键是依靠CSS3中的 “content”属性来实现.不过这个属性对于img和input元素不起作用. content配合CSS的伪类或者伪元素,一般可以做以下四件事情: 功能 功能说明 none 不生成任何内容 attr 插入标签属性值 url 使用指定的绝对或相对地址

页面中插入CSS样式的三种方法

页面中插入css样式的三种方法总结 1. 外部样式 当样式需要应用于很多页面时,外部样式表将是理想的选择.在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观.每个页面使用<link>标签链接到样式表. <link>标签在(文档的)头部: <head> <link rel="stylesheet" type="text/css" href="path/myCss.css"/> <

在页面中插入flash的代码实例

在页面中插入flash的代码实例: 有时候网页中需要插入一个flash,作为一个媒体文件,将其引入当然需要一定的格式,下面就介绍一下如何实现辞此功能,不过建议还是使用工具插入,比如使用DW,它就有专门的可视化工具直接点击按钮插入就可以了. 代码如下: <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="62" height="62" type="a

使用CSS3对页面中的文字添加彩色边框

<!doctype html> <html> <head> <meta charset="utf-8"> <title>使用CSS3对页面中的文字添加彩色边框</title> <style>  #boarder{  border:solid 5px blue;  border-radius:20px;  -moz-border-radius:20px;  padding:20px;  width:180

VSTO 向office文档中插入内容

原文:VSTO 向office文档中插入内容 Word: Word.Selection sec = ThisAddIn.appWord.Selection;            sec.InsertAfter(value); Excel: Excel.Workbook wbook = Globals.ThisAddIn.Application.ActiveWorkbook;  //当前活动workbook            Excel.Worksheet wsheet = (Excel.W

如何在页面中插入邮箱地址

如何在页面中插入邮箱地址: 下面分享一段大家比较常见的代码,就是如何在一个页面中插入邮箱地址. 代码如下: <a href="mailto:[email protected]">[email protected]</a> 原文地址是:http://www.51texiao.cn/HTML5jiaocheng/2015/0613/4146.html 最原始地址是:http://www.softwhy.com/forum.php?mod=viewthread&

如何在HTML页面中插入百度地图

在网页制作时,如果想要把企业地址以地图的形式插入HTML页面中,可以通过百度地图轻松实现,当然,前提是注册百度账号并且通过实名认证 网址:http://api.map.baidu.com/lbsapi/creatmap/ 第一步:定位中心点,选择城市以及你想要定位的具体地点 第二步:设置地图,根据HTML页面预留的宽高,选择合适的尺寸 第三步:添加标注,这里面的内容可以根据实际需求填写 第四步:获取代码,点击复制把代码复制到一个单独的文件中,然后把对应的html代码和js代码添加你的项目中 就这

如何在百度搜索页面中插入广告

郑重声明:本人发布分享是为了让更多的人知道这项技术的存在,从而寻找一些防止的方法,并不是想做一些非法的操作.我也很不喜欢在页面中植入广告.所以希望各位大神看了此文后能多提一些建议与改进.本人会虚心接受.不喜勿喷!!! 该技术是我无意中接触的能够跨域操作JS的情况,通过跨域JS操作可以实现在你使用百度搜索跳转到你所在的页面的时候会自动使得百度搜索页面也进行相应的跳转,从而实现操作者的很多目的.目前我通过研究已经弄懂实现原理,并未亲自尝试,所以该文也是起抛砖引玉的作用,希望各位前端大牛能进行一下研究