• 技术文章 >web前端 >css教程

    纯CSS3制作可编辑的微软Word样式文档

    黄舟黄舟2017-01-18 13:50:26原创964
    简要教程

    这是一款使用HTML和CSS3制作的可编辑的微软Word样式文档。该特效提供一组预定义的样式,用于在WEB页面中生成各种尺寸的Word样式的文档效果。它提供的样式包括:

    使用方法

    在页面中引入你需要的尺寸的样式文件,如使用A4纸则引入sheets-of-paper-a4.css文件。

    <link rel="stylesheet" type="text/css" href="css/sheets-of-paper-a4.css">

    HTML结构

    在<body>元素上添加document class,然后使用<div>作为包裹元素,并为它设置contenteditable="true"属性,使它里面的内容可以进行编辑。

    <body class="document">
      <div class="page" contenteditable="true">
        ...
      </div>
    </body>

    下面是该Word样式文档效果的界面截图:

    333.jpg

    以上就是纯CSS3制作可编辑的微软Word样式文档的内容,更多相关内容请关注PHP中文网(m.sbmmt.com)!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:CSS3,Word
    上一篇:纯CSS3百叶窗式切换轮播图特效 下一篇:7种纯CSS3搜索框UI设计效果

    相关文章推荐

    • 实例详解之怎样使用css实现3D穿梭效果• css怎么降低背景透明度• 怎么用css样式把图片改为灰色• css3如何让animation动画停止• css怎么实现图片放大缩小动画

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网