`

html里title属性换行的方法

 
阅读更多
众所周知,对于链接和图片,我们可以通过添加title 属 性以显示一些说明文字,一般情况下,这些文字都是显示成一行,那么有没有办法让它以多行的方式显示呢?解决的方法有两种:

1.将title 属 性分成几行来写,例如:
<ahref=#"title ="说明一
说明二
说明 三">印象派</a>

2.第一行相对来说不够直观,我们还可以在需换行 的地方添加&#10;(将&改为 半角,下同)或&#13;来实现:
<ahref=#"title ="说明一&#10;说明二&#10;说 明三">印象派</a>
<ahref=#"title ="说明一&#13;说明二&#13;说 明三">印象派</a>

==================

response.write " title='标 题:" & rsArticleList("Title") & vbcrlf & "作 者:" & rsArticleList("Author") & vbcrlf & "转 贴 自:" & rsArticleList("CopyFrom") & vbcrlf & "更新时间:" & rsArticleList("UpdateTime") & vbcrlf
response.write "点 击 数:" & rsArticleList("Hits") & vbcrlf & "关 键 字:" & mid(rsArticleList("Key"),2,len(rsArticleList("Key"))-2) & vbcrlf & "推荐等级:"

直接换行就可以

=======================

<a href='/news/detail/159.html' target='_ablank' title='标 题:fadfasdf
作 者:佚名
转 贴 自:本站原创
更新时间:2007-3-14 10:31:00
点 击 数:0
关 键 字:fdafdddfa
推荐等级:无
分页方式:不分页
阅读等级:游客
阅读点 数:0'>fadfasdf</a>
<div title="123&quot;&#10;456">text</div>
<p><a href=#" title="说明一&#10;说明二&#10;说明三">印象派</a>
<a href=#" title="说明一&#13;说明二&#13;说明三">印象派</a></p>

===========================

function decodeHTML(fString)
if not isnull(fString) then
fString = replace(fString, "&gt;", ">")
fString = replace(fString, "&lt;", "<")

fString = Replace(fString, "&nbsp;", CHR(32))
fString = Replace(fString, "&nbsp;", CHR(9))
fString = Replace(fString, "&quot;", CHR(34))
fString = Replace(fString, CHR(39),"&#39;")
fString = Replace(fString, "</P><P> ",CHR(10) & CHR(10))
fString = Replace(fString, "<BR> ", CHR(10))
decodeHTML = fString
end if
end function

function encodeHtml()

替换成unicode字符就可以

end function

=================================

以下为转出网上

今天在写插件时,需要在一段字符的title属性里加入一大段文字。字符串本身用UNIX行尾符LF换行。我直接输出字符串,发现在IE和 Firefox下都可以显示出断行。

<div title="123
456">text</div>

不过,Firefox的Html Validator扩展报了错。在网上搜了一圈,这里 提到:

The (X)HTML DTDs define the contents of the title attribute as CDATA for which the W3C states:
User agents should interpret attribute values as follows:

  • Replace character entities with characters,
  • Ignore line feeds,
  • Replace each carriage return or tab with a single space.

大概的意思是,XHTML DTD定义title属性为一个CDATA,而根据SGML里CDATA的定义,浏览器应该:替换所有html实体;忽略LF字符;替换所有CR字符和 tab字符为一个空格。

按照W3C的说法,执行这3步后,所有的CR和LF字符已经他们的html实体都已消失或变成空格了。看起来在title里换行变成不可能的事了。 不过,Firefox好像并没有转换CR字符为空格,而是把CR给忽略了。而LF字符倒是没有被处理,直接换行了。上面的代码,不用UNIX行尾符LF, 而是用Mac行尾符CR,在IE下还能换行,但是在Firefox下,CR字符直接被忽略了。我还是很想通过W3C的验证,所以做了一下测试,使用LF字 符或者LF的html实体& #10; 都 是可以的。网上流传说可以用CR的html实体& #13;,其实只是IE中可以,Firefox下一样不行。如果不追求符合W3C,那还不如直接把字符串转成UNIX行尾符输出呢。

<div title="123& #10;456">text</div>


还有,title里有小于号和单引号好像并不要紧,但是有双引号就不行了。这么说来,把字符串里的换行和双引号给替换一下输出就行了?唉,复杂复 杂,晕了。这里 有一个介绍这方面问题的页面,不过没太看懂。

发现CR的全称是Carriage Return,Carriage是字车的意思,Carriage Return意思是字车复位。LF的全称是Line Feed,喂进一行,就是新起一行的意思。这起源于打字机时代,每打到一行的末尾,打字员要手工把字车推回第一列,字车复位后,纸会上升一行。所以就有了 ASCII码值为13的CR和ASCII码值为10的LF两个字符。而DOS和Windows下文本文件的新行用CR和LF两个字符表示,UNIX下用 LF,Mac下用CR。呼,这些资料大概在上个世纪我就知道了,不过一直记不住两个字符的ASCII码是多少,现在复习一遍,这下我应该能记住了。[via ]

P.S. 好像C++里"/n"在Windows下输出CRLF,在UNIX下输出LF,而"/r"输出CR。PHP里是"/n"输出的是LF,"/r"输出的是 CR。

分享到:
评论

相关推荐

    HTML实现title 属性换行小技巧

    本文给大家带来的是一个在html中title属性换行的小技巧,非常的实用,这里推荐给各位,不用谢我~

    HTML title 属性换行的办法

    前两天在写程序的时候,想给提示信息(TITLE)换行...将title属性分成几行来写,例如: 印象派&lt;/a&gt; 2.第一行相对来说不够直观,我们还可以在需换行的地方添加 (将&改为半角,下同)或 来实现: 印象派&lt;/a&gt; 印象派&lt;/a&gt;

    html a 链接标签title属性换行鼠标悬停提示内容的换行效果

    鼠标经过悬停于对象时提示内容(title属性内容)换行排版方法,html title 换行方法总结。 html的title属性默认是显示一行的.如何换行呢? 这里DIVCSS5总结介绍两种换行方法为大家分享使用。 一、直接title内容换行...

    零基础学HTML CSS源代码

    title用法.html 链接参数title用法。 锚点链接.html 标记锚点链接用法 图片链接.html 演示图片链接。 文字链接.html 演示文字链接。 邮箱地址链接.html 演示邮箱地址链接。 链接实例手把手.html 演示链接实例...

    HTML开发王

    11.2.6 框架的描述(title属性、longdesc属性) 11.3 使用目标框架(name属性和target属性) 11.3.1 设置链接默认的目标 11.3.2 目标的优先级 11.3.3 名称和框架标识 11.4 内联框架(iframe元素) 11.5 巩固与自测 第12章 ...

    从入门到精通HTML5——PDF——网盘链接

     1.3.1 HTML文件的编写方法 5  1.3.2 文件开始标签&lt;html&gt; 7  1.3.3 文件头部标签&lt;head&gt; 7  1.3.4 文件标题标签&lt;title&gt; 7  1.3.5 文件主体标签&lt;body&gt; 7  1.3.6 编写文件的注意事项 8 ...

    响应式框架Bootstrap栅格系统的实例

    title&gt;&lt;/title&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt; &lt;link rel="stylesheet" href="css/bootstrap.min.css" rel="external nofollow" /&gt; [removed]...

    前端css+html+布局笔记

    &lt;标签名 属性名="属性值" 属性名="属性值"&gt;标签名&gt; &lt;标签名 属性名="属性值" 属性名="属性值" /&gt; HTML页面的基本结构 常用标签 &lt;html&gt; 网页的根标签 一个页面中有且只有一个根标签 网页中的所有内容都...

    HTML+css知识总结(建议收藏)

    属性有title显示内容,height与width宽高,alt无法显示显示备注,border图片边框宽度。 链接标签:a标签后必跟herf=“x”,其中x可以引用外部的链接或者内部链接,内部链接可以分为绝对路径与相对路径。上级路径...

    html入门到放弃笔记

    1、创建一个 div 标记 ,增加属性 ,设置 align 属性的值为 center ,设置 id 属性的值为 container,设置 title 属性的值为 这是一个div &lt;div align="center" id="container" title="这是一个div"&gt; 四大标准...

    HTML思维导图+学习笔记+实际案例

    (3)空标签:功能比较单一 例如:换行标签=== (4)不区分大小写,一般采用小写 (5)html文档申明: a、framset框架文档类型 b、严格的文档类型 c、过渡的文档类型(宽松的文档类型) d、html5的文档类型 ...

    html实验报告.doc

    Align属性(对齐方式)值为 " " "left(左对齐) center(居中) right(右对齐) " " "例如:  align="center"&gt;&lt;/p&gt; " " "(4)回车换行 " " "当在&lt;p&gt;&lt;/p&gt;标记对间行与行之间的距离比较小,在标记对外择行与行...

    asp学习笔记

    视频标记 src视频路径属性 auto等等属性 form 5/样式 css 给网站进行一些美工的 两个问题: 1/;"&gt; 框变成红线,没实现 2/&lt;form&gt; 用户名:&lt;input type="text" name="username"/&gt;&lt;br/&gt; &lt;input ...

    AnalyticsDataHTML:书签以在Alma Analytics Columns属性中添加自定义HTML数据格式

    AnalyticsDataHTML 书签以在Alma Analytics Columns属性中添加自定义HTML数据格式安装转到此网址,然后按照说明进行操作: 如何使用要添加和应用html格式的数据视图,只需打开“列”属性,转到“数据格式”选项卡,...

    HTML5与CSS3基础教程(第8版)高清文字

    3.15 为元素添加title属性 61 3.16 添加注释 62 第4章 文本 63 4.1 添加段落 63 4.2 指定细则 64 4.3 标记重要和强调的文本 65 4.4 创建图 67 4.5 指明引用或参考 69 4.6 引述文本 70 ...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -增加重载方法Alert.Show(message, title, icon)(feedback:TheBox)(WorkItem#6353)。 -为容器控件(比如Panel,Region,Tab等)增加AJAX属性IFrameUrl(feedback:BluesT)。 -重新设计模拟树的下拉列表的实现,避免...

Global site tag (gtag.js) - Google Analytics