Home>Article>Web Front-end> Create editable Microsoft Word style documents using pure CSS3

Create editable Microsoft Word style documents using pure CSS3

黄舟 Original: 2017-01-18 13:50:26 2602browse

Brief Tutorial

This is an editable Microsoft Word style document made using HTML and CSS3. This special effect provides a set of predefined styles for generating Word-style document effects of various sizes on WEB pages. The styles it provides include:

sheets-of-paper-a4.css: A4 paper (21cm × 29.7cm)
sheets- of-paper-a3.css：A3 paper(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)

Introduce the style file of the size you need into the page, if using A4 paper, introduce sheets-of -paper-a4.css file.

HTML structure

Add document class on the

element, then use

as the wrapping element, and set the contenteditable="true" attribute for it to make it inside The content can be edited.

...

The following is a screenshot of the interface of the Word style document effect:

Create editable Microsoft Word style documents using pure CSS3 The above is the content of pure CSS3 to create an editable Microsoft Word style document, more For related content, please pay attention to the PHP Chinese website (m.sbmmt.com)!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Pure CSS3 blind-style switching carousel effect Next article：Pure CSS3 blind-style switching carousel effect

See more

Create editable Microsoft Word style documents using pure CSS3

Related articles