CSS與字體雙邊對齊是網頁排版中經常會遇到的一個問題。在網頁排版中，我們通常會使用不同的字體，但是不同字體的字形可能不同，因此在對齊時可能會存在問題。這時我們就需要使用CSS技術來實現字體的雙邊對齊。

例如：
font-family: "微軟雅黑", "Microsoft Yahei", "SimSun", "sans-serif";

在使用CSS實現雙邊對齊時，我們可以使用text-align-last屬性。text-align-last屬性是用來指定段落的對齊方式。該屬性支持以下屬性值：

text-align-last:left;//左對齊
text-align-last:right;//右對齊
text-align-last:center;//居中對齊
text-align-last:justify;//兩端對齊
text-align-last:auto;//自動對齊方式

雙邊對齊時我們通常會使用text-align-last:justify屬性值，代碼如下：

p {
text-align: justify;
-moz-text-align-last: justify; /* Firefox 12+ */
text-align-last: justify;
font-family: "微軟雅黑", "Microsoft Yahei", "SimSun", "sans-serif";
}

在使用text-align-last:justify屬性值時，CSS會自動調整字符間距，使每行文字在兩端對齊。但是這種方式存在的問題是，在一行文本中，假如某個單詞長度過短，那么CSS會在該單詞后面添加很多空格，并且調整字符間距，使得該行文本的每個單詞在兩端對齊。這樣在某些情況下，可能會影響美觀度。

因此，我們還可以使用JS技術來實現雙邊對齊，并解決上述問題。代碼如下：

$(document).ready(function() {
var lineHeight = parseInt( $('p').css('line-height') );
$('p').css({
'text-align': 'justify',
'text-justify': 'inter-ideograph',
'word-break': 'break-all'
}).each(function() {
var content = $(this).html();
var contentLength = content.replace(/<\/?[^>]*>/g,'').length;
var lineCount = Math.ceil( contentLength / parseInt($(this).width() / 16) );
for(var i=0; i]*>/g,'').length*16 )/8)+1).join(' ');
$(this).html( $(this).html().replace(line, line+space) );
}
});
});

在使用JS實現雙邊對齊時，我們通過獲取段落的寬度和行高，來計算每行文本的字符個數。然后在每行字符后添加適量的空格，使得每行文本在兩端對齊。這樣就可以有效解決在一行中某些單詞長度過短，CSS調整字符間距過大導致影響美觀度的問題。

綜上所述，CSS與字體雙邊對齊在解決網頁排版中的對齊問題上扮演了重要的角色。我們需要根據實際情況，在使用CSS或JS實現雙邊對齊時，做出合適的選擇。