css样式可以在内容之前和之后加内容。
格式是：
css类名:before{content:在之前加的内容}
css类名:after{content:在之后加的内容}
这种写法在LODOP里直接测试是不行的，所以建议用其他方法所代替，例如用JS，或字符串直接拼接。
content:attr(class);可以用类型，在JS中，可用:对象.className获取到类名。
测试代码：

<script language="javascript" src="LodopFuncs.js"></script>

<style id="style1">

.c1:after

{

content:attr(class);

}

.c1:before

{

content:"之前";

}

.c2{color:blue;}

</style>

</head>

<body>

<div id="div1">

<p class="c1" id="c1">这是p标签里的内容</p>

</div>

<div id="div2">

<p class="c2" id="c2">这是p标签里的内容</p>

</div>

<a href="javascript:prn1_preview()">content前后加内容</a><br>

<a href="javascript:prn2_preview()">innerHTML前后加内容</a><br>

<script language="javascript" type="text/javascript">

        var LODOP; //声明为全局变量

    function prn1_preview() {

        LODOP=getLodop();

        LODOP.PRINT_INIT("");

        var strBodyStyle="<style>"+document.getElementById("style1").innerHTML+"</style>";

        var strDivHtml=strBodyStyle+"<body>"+document.getElementById("div1").innerHTML+"</body>";

        LODOP.ADD_PRINT_HTM(10,10,300,200,strDivHtml);

        LODOP.PREVIEW();

    };

    function prn2_preview() {

        LODOP=getLodop();

        LODOP.PRINT_INIT("");

        var p=document.getElementById("c2");

        console.log(p);

        var strp=p.innerHTML;

        console.log(strp);

        var classP=p.className;

        console.log(classP);

        p.innerHTML="之前"+strp+classP;

        LODOP.ADD_PRINT_HTM(10,10,300,200,document.getElementById("c2").innerHTML);

        LODOP.PREVIEW();

    };

</script>

</body>

图示：

用after、before和content给内容前后加上的，打印设计可以显示，预览出现问题。
用JS给前后内容加上的，预览正常。
（建议不用after，before和content给内容前后加内容，可以用JS或其他方式实现）

[lodop]css样式after、before添加content内容之前和之后的更多相关文章

  1. CSS样式表及选择器相关内容(二)-伪类与伪元素选择器

    伪类与伪元素选择器归纳: 一.伪类选择器(伪类以":"开头,用在选择器后,用于指明元素在某种特殊的状态下才能被选中)    1.a标签伪类选择器,其他标签类似        eg: ...

  2. CSS样式表及选择器相关内容(一)

    CSS(Cascading Style Sheets)层叠样式表1.CSS级联-CSS层叠:规定在哪个HTML中使用哪个样式. body{ font-size:16px; //body默认字体大小 } ...

  3. CSS样式逐li添加，执行完，清空，反复执行

    function change_light(el) { el.hide() let i = 0; function temp() { if (i > el.length - 1) { el.hi ...

  4. Web前端开发最佳实践（8）：还没有给CSS样式排序？其实你可以更专业一些

    前言 CSS样式排序是指按照一定的规则排列CSS样式属性的定义,排序并不会影响CSS样式的功能和性能,只是让代码看起来更加整洁.CSS代码的逻辑性并不强,一般的开发者写CSS样式也很随意,所以如果不借 ...

  5. 实验四  CSS样式的应用

    实验四  CSS样式的应用 注意:以下实验项目皆以本文件为操作对象,实验结果用记事本保留后预览,最后将添加的CSS代码转载到实验报告中 另本网页中蓝色加下划线的字即为默认的超链接样式 实验目的: 掌握 ...

  6. Emmet快速编写CSS样式

    基本的CSS样式编写时,很多样式只需输入首字母即可得到不带属性值的CSS样式,像上面说到的margin. 1.而对于一些带有特定的属性值的CSS样式,只需输入CSS标签与属性值的首字母就可以,比如: ...

  7. html基础：css样式1

    h't'm'l中用到css样式有三种方式: 1.在header中增加style标签,在style标签中写 2.用link标签引用css样式文件 3.在需要使用css样式的标签添加style属性 一.在 ...

  8. CSS content内容生成技术以及应用

    content属性早在CSS2.1的时候就被引入了,可以使用:before以及:after伪元素生成内容.此特性目前已被大部分的浏览器支持:(Firefox 1.5+, Safari 3.5+, IE ...

  9. CSS content内容生成技术以及应用（转）

    一.哗啦哗啦的简介 zxx://这里“哗啦哗啦”的作用是为了渲染一种氛围.content属性早在 CSS2.1的时候就被引入了,可以使用:before以及:after伪元素生成内容.此特性目前已被大部 ...

随机推荐

  1. linux 下安装 nginx 及所需的各种软件工具

    我当前的虚拟机是 vmware 15,用的镜像是centOs 7 CentOS-7-x86_64-DVD-1810.iso 确保你的虚拟机是通网的. 1.如果是新环境,没安装过gcc,那么先安装这个. ...

  2. 2019/7/18 --1.<%@ include file=""%>与<jsp:include page=""/>两种方式的作用

    一.前言 身为一名coder有太多太多的知识点要去学,太多太多的东西要去记.往往一些小细节也就难免疏忽,但悲催的是多数困恼你的bug就是因为这些微不足道的知识点.我们又不是机器人,怎么可能什么都记得了 ...

  3. asp.net使用WebUploader做大文件的分块和断点续传

    HTML部分 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="index.a ...

  4. bzoj 3566: [SHOI2014]概率充电器 数学期望+换根dp

    题意:给定一颗树,树上每个点通电概率为 $q[i]$%,每条边通电的概率为 $p[i]$%,求期望充入电的点的个数. 期望在任何时候都具有线性性,所以可以分别求每个点通电的概率(这种情况下期望=概率 ...

  5. PHPStorm启动问题--Failed to load JVM DLL

    一.问题 启动PHPStorm时突然遇到PHPStorm无法启动的问题,提示:Failed to load JVM DLL,如图所示:

  6. 金蝶kis 16.0专业版-破解01

    Kingdee.KIS.MobAppSer>MainViewModel 经过反混淆后,找到导入LIcense文件后的验证函数. 下面仅需进行逆向生成即可,为什么一定要进行生成lic文件方式进行破 ...

  7. 项目发布到tomcat后，通过项目名称访问报404

    查看tomcat发布地址发现和项目名称不一致 如果直接拷贝项目,可能也需要修改此选项 解决方案: 经过排查发现了原因: 首先说明一下项目 Maven+SSM 需要使用到 maven tomcat 7 ...

  8. 本地spark报：java.lang.UnsatisfiedLinkError: org.apache.hadoop.io.nativeio.NativeIO$Windows.createFileWithMode0(Ljava/lang/String;JJJI)Ljava/io/FileDescriptor;

    我是在运行rdd.saveAsTextFile(fileName)的时候报的错,找了很多说法……最终是跑到hadoop/bin文件夹下删除了hadoop.dll后成功.之前某些说法甚至和这个解决方法自 ...

  9. C语言strncasecmp()函数：比较字符串的前n个字符

    定义 int strncasecmp(const char *s1, const char *s2, size_t n); 描述 strncasecmp()用来比较参数s1 和s2 字符串前n个字符, ...

  10. Leet Code 2.两数相加

    2.两数相加 题目描述 给出两个非空的链表用来表示两个非负的整数.其中,它们各自的位数是按照逆序的方式存储的,并且它们的每个节点只能存储一位数字.如果,我们将这两个数相加起来,则会返回一个新的链表来表 ...