将一个长页面拆分为多个页面
我想将由长文本输入和一些图像组成的动态内容拉入具有固定宽度(300px)和高度(1000px)的div,挑战是当内容长度时我无法在css中使用overflow: auto超过了 div 的高度(1000px),相反,我被要求将长内容分割成带有分页的页面。
可以用 PHP 实现还是必须使用 javascript (jquery) 实现?
我想计算字符数并分割它们,但当内容带有不同大小的图像时,它似乎不正确......
有什么想法吗?
I want to pull a dynamic content, which consists of a long text input with some images, into a div with a fixed width (300px) and height (1000px), the challenge is I cannot use overflow: auto in css when the content's length is exceeding the div's height (1000px), instead, I am asked to split the long content into pages with a pagination.
Is it possible to achieve with PHP or do I have to use javascript (jquery)?
I was thinking to count the number of characters and splitting them, but it doesn't seem correct when the content comes with different sizes of images...
Any ideas??
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
在服务器端执行这可能会非常复杂(我想说“不可能”),因为有太多无法计算的客户端效果(浏览器默认设置的边距、填充、行高) 、字体大小和缩放的用户设置),我更喜欢在客户端执行此操作。
我使用 jQuery 做了一个小例子: http://jsfiddle.net/doktormolle/XwUuA/
它获取目标元素的子节点,并将它们包装成与目标元素具有相同尺寸的新元素(只要包装器的高度不超过目标元素的高度)元素)。
也许对你有用(这是一个草案,当然还需要修改以满足你的需求)
This might be very complicated(I'd like to say "impossible") to do it on the serverside, because there are too many clientside effects that can't be calculated(browser-default-settings for margins, paddings, line-height, font-size and user-setting for zooming), I would prefer to do this on clientside.
I made a little example using jQuery: http://jsfiddle.net/doktormolle/XwUuA/
It takes the childnodes of the target-element, and wraps them into new elements which have the same dimensions like the target-element(as long as the height of the wrapper does'nt exceed the height of the target-element).
Maybe it's useful to you(It's a draft, of course there still has to be worked on it to match your needs)
你可以使用PHP。找出每行可以包含多少个字符,以及您的 div 可以容纳多少行字符。然后,使用 PHP,计算字符数,除以字符/行,然后您将得到文本将占用的行数。然后您可以使用 getimagesize() 获取图像尺寸,然后从那里开始。
有关详细信息,请参阅 PHP 函数。
You could use PHP. Find out how many characters you can get per line, and how many lines of characters will fit in your div. Then, with PHP, count characters, divide by characters/line, then you'll have how many lines your text will take up. Then you can use getimagesize() to get an images dimensions, and go from there.
See the PHP function for more info.
我想用 HTML 做一些类似的事情,但是在 C# Windows 窗体应用程序中。
我想做的是根据一些数据库表生成一些内容并将它们发送到打印机。内容必须适合 A4 纸。
经过大量的试验和错误后,我根据内容的大小、位置等测量了内容的最大大小,并将数字写入 HTML 的 CSS 部分。
这样我就能得到一个不错的结果。某些输入仍然存在一些轻微错误,但这对我有用!
I wanted to do something similar with HTML but in a C# Windows Forms application.
What I wanted to do was to generate some contents based on some database tables and send them out to the printer. The contents had to fit into A4 papers.
After lots of trial and error I measured the maximum size of the contents based on their size, place etc. and wrote the numbers in the CSS portion of my HTML.
With that I could get a nice result. Still some slight errors on some inputs, but that worked for me!