手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜的Vultr , 注册 | 登陆
浏览模式: 标准 | 列表Tag:html

将网页生成pdf的快速方法

 在网上看到一篇好文章 ,以前都是加入收藏夹,以后可以打开来看。

后来,开始用:readitlater(现在改名叫pocket了),确实都比较方便,毕竟pocket也是全平台支持的。
但即使这样,也会遇到不少的问题,即pocket中的网页已经无效了。晶啊,这太让人纠结了,我存下来可不是只要一个网址的
 
当然在windows下面,以前还用cyberarticle(网文快捕),现在叫wiz了,但不能存在自己的服务器上,总是不太舒服。
 
于是就想着把内容copy出来存为word,方便以后查,但现在,发现有快速生成pdf的方式,轻松将网页生成pdf了,以后查询起来就方便了:
大小: 89.28 K
尺寸: 490 x 376
浏览: 1409 次
点击打开新窗口浏览全图
 
上图怎么样?可以选择指定内容,可以指定背景。而且,不需要额外装软件。
它是谁?它是chrome
嗯,直接按打印就能看到上述菜单了。还不赶紧试试?

Tags: pdf, html

部分转:卡片、页与卷轴

其实想转这篇文章好久了,但一直在犹豫。众所周知,如今的pad上的文章、HTML网页,都在尝试着改变。如果让人还在不停的向上拖动页面,好象就会被人所诟病。
于是乎翻页就显得至关重要。
从最早ipad上可见的ibooks中的书籍可了解,翻页其实是一件很痛苦的事情。它需要将你的文章内容由程序自己算好,然后将它分页,于是这里面的代价消耗就非常大。一篇文章如果有上千页,当你选择改变字体大小的时候,ibooks就象死机一样,无法拖动。毕竟这个时候程序在计算页码,重绘页面。超级痛苦,而pad又不象台式机那样CPU强劲。带来的郁闷可想而知。
于是更多的人尝试PDF阅读,毕竟当一篇文章转为PDF后,带来的好处也是显而易见,格式固定,编排方便,可以随意跳转,而且PDF的格式公开,任何人都可以尝试制作它,更关键的是,ipad内建支持pdf(如ibook)。但同时也会有一点小问题,比如,不能调整字体大小,不能插入广告(我想这个对于想赢利的企业来说恐怕是最痛苦的),容易被人打包下走所有数据(企业会更恨这个原因)
当kindle出第二版的时候,很多人都在惊呼,阅读的时代要改变了。国内有个做kindle系统打包的叫做“多看”,它对PDF也做了处理,能够对PDF进行分页,很多国内的电子书用户都选择了多看系统,因为看书更方便了。(它实现的也是类似ibook的效果)
好了,先看原文吧,我废话太多了。。。。原文来自:http://apple4.us/2012/02/card-pagination-scroll-lawrence-column-for-blogweekly.html,我部分摘抄
正如原文中所说:

XML/HTML代码
  1. 关于分页与否的讨论自 1980 年代就已开始。苹果 Macintosh 的创始人杰夫·拉斯金用「卡片」和「卷轴」来比喻分页与不分页这两种对信息的呈现方式。到目前为止,万维网(web)基本是卷轴的天下。但电子书的勃兴令情况开始有了变化。  

互联网时代大家都清楚,鼠标滚动。。。

XML/HTML代码
  1. 和大部分软件一样,电子书软件的设计也能找到真实世界中的对应。正如早年的图形介面系统设计者根据桌面、文件、文件夹、垃圾桶这些办公环境中的标配物件想象出了一套譬喻,电子书软件从一开始就沿袭了纸书的习惯,以「页」为基本单位。另一方面,因为一些不必在此深究的原因,大部分主流电子书软件所用的技术恰恰就是万维网的技术──HTML, CSS, JavaScript,亚马逊的 Kindle 与苹果的 iBooks 都不例外。电子书事实上就是「分了页的网页」。  
  2.   
  3. 电子书的读者对于分页与否各有偏好,不过技术潮流由赢家设定。从过去几个月的发展看来,分页是大趋势。亚马逊不久前宣布将推出 Kindle Format 8 格式,将更多平面排版的元素引入 Kindle 书中。苹果的 iBooks 2 与电子书制作软件 iBooks Author 也做了类似的事情,且完成度更高。(其实苹果一直是卡片式设计的支持者。万维网出现之前最成功的超媒体系统 HyperCard 就出自苹果之手,他们甚至把「卡片」一词写进了软件名称。)Flipboard 和 Zite 等热门阅读软件用分页的方式对网页进行了重排,老牌浏览器 Opera 亦于去年启动了实验性的 Opera Reader 计划,目标类似。  
  4.   
  5. 这里的终极问题是:设计师应该拥有多少控制权?在发轫于互联网时代的「赋权于民」的大潮流下,设计的权力是否也应该下放给普通用户?如上所述,从信息设计的角度而言,卡片式 / 分页设计的好处显而易见。它为设计师提供了一种具象而直接的限制(没有限制就没有设计)。对于读者来说,上下左右四条固定的边界也对注意力形成了一定程度的约束。这是用户权力的收缩,也是对设计师和内容生产者的控制权的重新认可。若卡片式设计能取代卷轴成为明日的主流,对于内容方实为幸事。  

卡片还是卷轴,其实真的很让人难以选择。原文中Kindle Format 8Opera Reader 都有链接,有兴趣的可以看看。
说来说去,这又回到了开始:

XML/HTML代码
  1. 在纸张出版的世界里,无页不成书。分页的重要性不太会被提起,因为它早已像空气一样无处不在。页界定了包裹内容的边界,是对信息的一种切割──我让你看到的不是全部,而是我挑选过的局部。以页为单位,给了设计师与编辑(编辑也是设计)做选择的可能──没有限制就无需做选择,而做选择就是设计。(包括选择今晚去哪家餐厅吃饭。)  

电子书也需要越来越向纸书那样有页码吗?不过,如果真的没有页码,跳转的时候会比较痛苦吧。从程序设计的角度来说,如果没有页码,也就是说几乎要将所有的内容放到一个容器中,而有了页面,为了翻页速度可以直接读取该页码附近左右的各5页内容,会更方便,也更减少资源的消耗。
然而,真的很痛苦,HTML分页太痛苦了。其他的呢?国内的几个ipad上的阅读软件现在都在好象慢慢放弃HTML分页了,而flipboard越仍然在坚持。
那,我们又是否应该再坚持呢?HTML分页有优点,它的优点在于可以很方便的为HTML网页做一些特别的效果。但带来的问题是大量的精力和开发资源都耗在这上面。(国内的专业做javascript开发的,真的很少啊。专业做这一行的,对于切入HTML排版好象也很排斥,不知道为什么。)
如果你是BOSS,你会怎么选择?

Tags: 分页, html, kindle, flipboard, ipad

学习HTML中的意外发现:xmp,plaintext

最近被人劝唆,准备捡起HTML了。。想从事一下DIV CSS的工程,准备转行做前端吧。。。说说而已,能力太差。
早上借了强哥的书在看,随手一翻,居然翻到了一页,说是在HTML页面里把HTML标记正常显示出来,这个标记好象以前都没有看过。以前只注意了把HTML内容格式化输出。

这两个标签是xmp和plaintext。

例如<xmp><input type="text" /></xmp><plaintext><input type="text" />

这两个标签里的内容,在firebug里可以看出来,被转成类似htmlspecialchar处理过的代码,所以,它们就直接显示在页面上了,也就是说,它里面的内容,如果想再转为标准的DOM结构,还得再作处理,怪不得很多大网站在做DOM转换的时候,都是情愿存存储到textarea里,毕竟在文本框里面,HTML都不用做转义,那是多么开心的事情啊。。。

PS:plaintext是单标签,所以,在它之处的所有内容全部变成了HTML输出了。。。小心使用啊。

白激动了。

Tags: html, xmp, plaintext

表单提交时submit按钮的值没有被提交

今天在RPC里面,阿刁提出个问题,FORM表单中,submit提交的时候,有时候有值,有时候无值 ,想问清楚是什么原因

状态描述:

1、FORM表单中,submit的name是Submit。即 <input type="submit" name="Submit" value="提交表单" />

2、当点击submit按钮时,FORM被提交,提交后获取的数组中有Submit下标的值

3、回到FORM表单,直接敲回车提交,这时候发现获取的数组中没有Submit下标。

纠结的是:为什么会有两种情况的不同

查找原因,最后基本确认,这是由于form在不同情况下,可以直接使用回车进行提交表单而导致的问题。这里有几篇参考文章:不同浏览器对回车提交表单的处理办法表单提交按钮input和button的取舍。那么,为什么敲回车和点击submit不一样呢?怎么样才能让他们一样?

尝试将focus移到submit按钮上。敲回车提交。这时候,是带有Submit值的。如果focus不在submit按钮上,则无效。知道了问题的原因,那就有解决方法了。对于submit,不要设name值 。如果确实需要传递值 ,请使用hidden域进行值的提交。以防止数据产生偏差。

Tags: submit, html, form

写HTML和CSS的新方法

Zen Coding 一个用来简化编写 HTML,XML, XSL (或是其它一些诸如此类格式的编辑器)。其主要是用一种缩写方式的语法来书写大量重复和无味的HTML,很像CSS语法。下面是一个例子:div#page>div.logo+ul#navigation>li*5>a

效果就是:

XML/HTML代码
  1. <div id="page">  
  2.         <div></div>  
  3.         <ul id="navigation">  
  4.                 <li><a href=""></a></li>  
  5.                 <li><a href=""></a></li>  
  6.                 <li><a href=""></a></li>  
  7.                 <li><a href=""></a></li>  
  8.                 <li><a href=""></a></li>  
  9.         </ul>  
  10. </div>  

 

这玩意是我在PHPRPC群里缘起缘灭推荐的,看了一下,效果还不错。。再去官网看了一下,居然有支持notepad++,很兴奋的下载下来使用了。效果还不错。

如果你一直是在用手写HTML代码而不是用IDE,确实 推荐一下。

上面的演示内容来自:http://coolshell.cn/?p=2406,官网请点击:Zen Coding

 PS:如果你真的不会用,没关系,这里还有一个PDF下载下来看看就行了:zencodingcheatsheet.pdf

Tags: xpath, html, css

Records:12123