jQuery選項卡左右布局是一種常見的頁面布局方式。它通常在頁面上方添加一個菜單欄，菜單欄中的每個選項都對應著頁面中的一個選項卡。用戶可以通過點擊菜單欄中的選項來切換頁面中的選項卡。

<div id="menu">
<ul>
<li><a href="#tab1">選項卡1</a></li>
<li><a href="#tab2">選項卡2</a></li>
<li><a href="#tab3">選項卡3</a></li>
</ul>
</div>
<div id="content">
<div id="tab1">
<h2>選項卡1的內容</h2>
<p>這里是選項卡1的內容。</p>
</div>
<div id="tab2">
<h2>選項卡2的內容</h2>
<p>這里是選項卡2的內容。</p>
</div>
<div id="tab3">
<h2>選項卡3的內容</h2>
<p>這里是選項卡3的內容。</p>
</div>
</div>

在上述代碼中，菜單欄使用一個div標簽來包裹，選項卡的內容則使用一個id為"content"的div標簽來包裹。每個選項卡內容都使用一個id來標識。

接下來，我們可以使用jQuery來實現選項卡的切換效果。

$(function(){
$("#menu ul li a").click(function(){
var tab_id=$(this).attr("href");
$("#content div").hide();
$(tab_id).show();
return false;
});
});

在上述代碼中，我們首先通過選項卡菜單欄中的a標簽的點擊事件來獲取當前選項卡的id。然后將所有選項卡的內容都隱藏起來，通過當前選項卡id來顯示對應的選項卡內容。

通過上述代碼和布局方式，我們可以實現一個簡單的選項卡頁面，提升用戶使用體驗和頁面可讀性。