masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial css > 纯CSS3制作可编辑的微软Word样式文档

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

黄舟
Lepaskan： 2017-01-18 13:50:26
asal
2732 orang telah melayarinya

简要教程

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

  • sheets-of-paper-a4.css：A4纸(21cm × 29.7cm)

  • sheets-of-paper-a3.css：A3纸(29.7cm × 42cm)

  • sheets-of-paper-usletter.css：US letter(21.6cm × 27.9cm)

  • sheets-of-paper-uslegal.css：US legal(21.6cm × 35.6cm)

  • sheets-of-paper-ustabloid.css：US tabloid(27.9cm × 43.2cm)

使用方法

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

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

HTML结构

在元素上添加document class，然后使用

作为包裹元素，并为它设置contenteditable="true"属性，使它里面的内容可以进行编辑。

<body class="document">
  <div class="page" contenteditable="true">
    ...
  </div>
</body>
Salin selepas log masuk

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

333.jpg

以上就是纯CSS3制作可编辑的微软Word样式文档的内容，更多相关内容请关注PHP中文网（www.php.cn）！


Label berkaitan：
CSS3，Word
sumber：php.cn
Artikel sebelumnya：纯CSS3百叶窗式切换轮播图特效 Artikel seterusnya：7种纯CSS3搜索框UI设计效果
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Mendapatkan lajur jadual untuk disusun pada paparan mudah alih ialah matlamat saya Saya mempunyai 5 lajur dan saya menjadikannya sebagai jadual kerana itu cara paling mudah ...
daripada 2024-04-02 20:50:17
0
1
274
Jadikan halaman itu mesra mudah alih? Saya mempunyai banyak halaman web dan beberapa laman web. Masalahnya, saya seorang pemula....
daripada 2024-04-01 20:42:38
0
1
259
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan