现在哪些做进口商品的电商网站,如何制作门户网站,wordpress seo选项,网业设计案例如下#xff1a;
混合使用汉字和英文的段落默认如下#xff1a; 两边是不对齐的(一般情况下#xff0c;我们对这种情况不做处理#xff0c;除非需求或者设计非要我们实现两端对齐)。 对齐之后如下#xff1a; 实现思路
一般的两端对齐是使用text-align:justify…案例如下
混合使用汉字和英文的段落默认如下 两边是不对齐的(一般情况下我们对这种情况不做处理除非需求或者设计非要我们实现两端对齐)。 对齐之后如下 实现思路
一般的两端对齐是使用text-align:justify但是text-align:justify一般情况下只针对英文管用。因为css是老外设计的老外在justify判断的时候是根据单词直接的空格来的中文两个汉字之间没有空格所以大部分情况下text-align:justify不管用所以这个属性大部分形同虚设。
解决办法
步骤一 就是在汉字之间添加空格然后再去除空格来实现。
添加空格我们用js来实现先split然后再join就可以了
代码如下 某某某某haorooms博客.split().join( );
步骤二添加空格之后字间隙变大会很难看然后我们在用css的letter-spacing属性进行相应的缩进。
代码如下 letter-spacing: -0.15em;
这样就达到了两端对齐的效果。
总结
按照上面的思路总结起来用jquery实现代码如下 $(#haorooms).css({text-align:justify,letter-spacing:-0.15em}); $(#haorooms).html()$(#haorooms).html().split().join( );
注释
-0.15em这个值可以指定根据你当前的便宜来设置-0.15em值是经验所得em是一个单位
当然也可以用纯js来实现这个效果代码如下 var boxdocument.getElementById(haorooms); box.style.textAlign justify; box.style.letterSpacing -.15em; box.innerHTML box.innerHTML.split().join( ); 转载请注明前端录»css段落文字中英文混杂实现两端对齐 script srchttp://www.wozhuye.com/index.php?mdiggcindexainitid14-302-2/script
