Html 强制背景绘制到线条的末尾

我有一个自定义标记

ab

，它的定义如下，所以我想在文本后面画一条黑线，直到线的末尾。如何实现这一点？

将

ab{display:block；}

添加到CSS中。演示：

默认情况下，未知元素是内联的（

display:inline

）

如果您想在InternetExplorer8和更早版本中使用样式，则需要使用一些JavaScript。Karl Nicoll的回答描述了一种适用于屏幕媒体的解决方案，但它仍然无法为打印媒体启用样式。如果这是您想要的，您可以使用此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)

/*！iepp v1.6.2麻省理工学院@jon_neal*/
（函数（k，o）{var a='ab'，f=a.split（'|'），d=f.length，b=new RegExp（'（^ |\\s）（'+a+'），'gi'），h=new RegExp（'Add
display:block
）：

ab.s {
    background: #000000;
    color: white;
    display: block
}



如果您正在创建自己的元素（
ab
），则应将其添加到JavaScript文件中，以使其能够在旧版本的Internet Explorer中正常工作

例如：

你是说像这样

我添加了
display:block
，使其成为块元素

ab.s{
    background: #000000;
    color: white;
    display:block;
}

您需要将
display:block
添加到CSS中

未定义的元素或浏览器不知道的元素将始终默认为内联（即与
标记的作用相同），因此您必须手动使它们成为块元素

请记住，如果您打算使用此元素，则需要使用如下JavaScript攻击，以使其在旧版本的internet explorer（9.0之前）中工作：


文件。createElement（“ab”）；

当放置在HTML的
中时，它将强制IE将其识别为元素。没有它，Internet Explorer将忽略您的标记。
请注意
document.createElement（）
仍然无法为打印媒体启用元素样式设置。
ab.s{
    background: #000000;
    color: white;
    display:block;
}

<script type="text/javascript">
    document.createElement("ab");
</script>