jquery.wordexport将网页dom导出为doc word文档代码

代码语言:html

所属分类:其他

代码描述:jquery.wordexport将网页dom导出为doc word文档代码

代码标签: dom 导出 doc word 文档

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
    @charset "utf-8";
/*框架预览 CSS*/
.mkeBody{ background:#121212;}
.mkeHeadBox{ padding: 30px 10px; text-overflow: ellipsis; white-space: nowrap; margin: 0; color: #fff; text-align: center; overflow: hidden; border-bottom: 3px solid #666; box-shadow: inset 0 -2px 3px #000000; letter-spacing: 1px; font: 26px/26px "微软雅黑"; }
.mkeFooterBox{ padding: 25px 10px; text-overflow: ellipsis; margin: 0; color: #fff; font-size: 14px; line-height: 24px; text-align: center; overflow: hidden; border-top: 3px solid #666; box-shadow: inset 0 2px 3px #000000; }
.mkeContentBox{ background:#494A5F; padding:50px}
.mkeContentBox:after{height:0; clear:both;}
.mkeFooterBox p,.mkeFooterBox div{padding:0; margin:0; line-height:26px; font-size:14px;}
.mkeFooterBox a{color:#fff; white-space:nowrap}
.mkeButton{background:#F36; display:inline-block; text-decoration:none; width:102px; border-radius:0.3em; transition:all 0.3s ease}
.mkeButton:hover{ background: #FF1550; }
.mkeURL{font-size:24px;}
.mkeFooterBox .mKeBannerAD{ width: 728px; height: 90px; margin: 18px auto 0; }
.mkeFooterBox .mSmallKeBannerAD{display:none;}
@media only screen and (max-width:900px){
.mkeButton {display:block; margin:8px auto 0;}
}
@media only screen and (max-width:767px){
.mkeHeadBox{font-size:18px; padding:15px 10px;}
.mkeFooterBox p,.mkeFooterBox div{ line-height:24px; font-size:12px;}
.mkeURL{font-size:22px;}
.mkeFooterBox .mKeBannerAD{display:none;}
.mkeFooterBox .mSmallKeBannerAD{width:300px; height:250px; margin:18px auto 0; display:block;}
}
/*End*/

/*主要CSS*/
body, html { font-size: 100%; 	padding: 0; margin: 0;}

/* Reset */
*,
*:after,
*:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after {
	clear: both;
}

body{
	background: #494A5F;
	color: #D5D6E2;
	font-weight: 500;
	font-size: 1.05em;
	font-family: "Microsoft YaHei","宋体","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif, FreeSans, Arimo;
}
a{ color: rgba(255, 255, 255, 0.6);outline: none;text-decoration: none;-webkit-transition: 0.2s;transition: 0.2s;}
a:hover,a:focus{color:#74777b;text-decoration: none;}
.word-icon{
	font-family: "Helvetica", sans-serif;
    font-size: 24px;
    font-weight: bold;
    background-color: #0054a6;
    color: white;
    padding: 2px 5px;
    vertical-align: middle;
}
</style>
</head>
<body class="mkeBody">
<div class="mkeHeadBox">将网页内容导出Word文档jQuery插件</div>
<div class="mkeContentBox">
<!--效果html开始-->
<div class="container">
	<div class="row">
		<div class="col-md-9" id="pagecontent">
			<h3>秋天的韵味</h3>			
			<p>夏天的燥热还没有完全褪去,秋天便伴着几场秋雨悄悄来了。于是,秋天的韵味便展现在我们的身边。</p>
			<p>秋的韵味体现在每天的早晚两头,空气不再闷热,给人以清凉爽快的感觉,推开窗户,便有清风吹进。中午时刻,有时阳光还是那么热烈,但站在树下的阴凉处,便觉秋风习习,凉快了许多。</p>
			<p>秋的韵味裹挟在阵阵秋风里。秋天的风,凉而不寒,多情而不疯狂。秋风轻抚你的肌肤,撩拨你的发丝,一下子安抚了你躁动的心,似乎在悄悄提醒我们:秋天来了。</p>
			<p>秋天的韵味挂在天空。空中明净如洗,湛蓝无比,那是一种新鲜却不张扬,柔和又不失明快的色彩,它又是那样高旷悠远。 七月八月看巧云,秋天的晚霞变化万千,绚丽多彩,有时红的像一团火,有时美的像一幅画,有时萌动得像一部水幕电影,有时朵朵白云像羊群 奔跑,像骏马驰骋……..使人目不暇接,充满幻想。</p>
			<p>秋天的韵味藏在花丛中。南方的桂花花香正浓,北方的秋菊又开了。“秋来谁为韶华主,总领群芳是菊花”。菊花,浓缩了冬春夏的精华,在百花凋零的季节,迎着风.........完整代码请登录后点击上方下载按钮下载查看

网友评论0