强制背景画线直到行尾 [英] Force background to draw on till end of line

问题描述

我有一个自定义标记 ab ，它的定义像 http://jsfiddle.net/JcLx4/2/ 我想在文本画线后面画黑线，直到行尾。我将如何实现这一目标？

解决方案

添加 ab {display：block; } 到CSS。演示： http://jsfiddle.net/JcLx4/6/

默认情况下，未知元素是内嵌的（ display：inline ）。

如果您想要要在Internet Explorer 8及更早版本中使用样式，您需要使用一些JavaScript。卡尔尼科尔的回答描述了一种可用于屏幕媒体的解决方案，但它仍然不能启用印刷媒体的样式。如果这就是你想要的，你可以使用这个修改后的版本的IE打印保护器：

  / *！ iepp v1.6.2 MIT @jon_neal * / 
（函数（k，o）{var a ='ab'，f = a.split（'|'），d = f.length，b = new RegExp '（'+ a +'）'，'gi'），h = new RegExp（'<（/ *）（'+ a +'）'，'gi'），m =新RegExp（'（^ | [^ \\\\
] *？\\s）（'+ a +'）（[^ \\\\
] *）（{[\\\\
\ \w\\W] *}？）， 'GI'）中，p = o.createDocumentFragment（）中，i = o.documentElement，N = i.firstChild，C = o.createElement（ '主体'） ，g = o.createElement（'style'），j; function e（r）{var q = -1; while（++ q '）; while（++ r   

$ c> var a ='ab'？您可以使用 | 作为分隔符来添加其他元素。 var a ='ab | foo | bar'将启用< ab> ，< ; foo> 和< bar> 造型。

I've got a custom tag ab which is defined like so http://jsfiddle.net/JcLx4/2/ I want to make the black line behind the text draw till end of the line. How would I achieve this?

解决方案

Add ab { display: block; } to the CSS. Demo: http://jsfiddle.net/JcLx4/6/

Unknown elements are inline (display: inline) by default.

If you want the styling to work in Internet Explorer 8 and older versions, you’ll need to use some JavaScript. Karl Nicoll’s answer describes a solution that will work for screen media, but it still won’t enable the styles for print media. If that’s what you want, you can use this modified version of the IE Print Protector:

/*! iepp v1.6.2 MIT @jon_neal */
(function(k,o){var a='ab',f=a.split('|'),d=f.length,b=new RegExp('(^|\\s)('+a+')','gi'),h=new RegExp('<(/*)('+a+')','gi'),m=new RegExp('(^|[^\\n]*?\\s)('+a+')([^\\n]*)({[\\n\\w\\W]*?})','gi'),p=o.createDocumentFragment(),i=o.documentElement,n=i.firstChild,c=o.createElement('body'),g=o.createElement('style'),j;function e(r){var q=-1;while(++q<d){r.createElement(f[q])}}function l(u,s){var r=-1,q=u.length,v,t=[];while(++r<q){v=u[r];if((s=v.media||s)!='screen'){t.push(l(v.imports,s),v.cssText)}}return t.join('')}e(o);e(p);n.insertBefore(g,n.firstChild);g.media='print';k.attachEvent('onbeforeprint',function(){var r=-1,u=l(o.styleSheets,'all'),t=[],w;j=j||o.body;while((w=m.exec(u))!=null){t.push((w[1]+w[2]+w[3]).replace(b,'$1.iepp-$2')+w[4])}g.styleSheet.cssText=t.join('\n');while(++r<d){var s=o.getElementsByTagName(f[r]),v=s.length,q=-1;while(++q<v){if(s[q].className.indexOf('iepp-')<0){s[q].className+=' iepp-'+f[r]}}}p.appendChild(j);i.appendChild(c);c.className=j.className;c.innerHTML=j.innerHTML.replace(h,'<$1font')});k.attachEvent('onafterprint',function(){c.innerHTML='';i.removeChild(c);i.appendChild(j);g.styleSheet.cssText=''})})(this,document)

See where it says var a='ab'? You can add other elements there, using | as a separator, e.g. var a='ab|foo|bar' will enable <ab>, <foo> and <bar> styling.

这篇关于强制背景画线直到行尾的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！