實現簡潔的選項卡效果可以使用以下步驟：

1. 首先，在HTML中創建選項卡的結構，例如：

<div class="tab-container">
  <div class="tab">
    <button class="tab-btn active" data-tab="tab1">Tab 1</button>
    <button class="tab-btn" data-tab="tab2">Tab 2</button>
    <button class="tab-btn" data-tab="tab3">Tab 3</button>
  </div>
  <div class="tab-content" id="tab1">Tab 1 content</div>
  <div class="tab-content" id="tab2" style="display: none;">Tab 2 content</div>
  <div class="tab-content" id="tab3" style="display: none;">Tab 3 content</div>
</div>

2. 然后，在CSS中定義選項卡的樣式，例如：

.tab-btn {
  background-color: #f1f1f1;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
}

.tab-btn.active {
  background-color: #ddd;
}

.tab-content {
  display: none;
  padding: 10px;
}

3. 最后，在JavaScript中實現選項卡的切換效果，例如：

const tabs = document.querySelectorAll('.tab-btn');
const tabContents = document.querySelectorAll('.tab-content');

tabs.forEach(tab => {
  tab.addEventListener('click', () => {
    const tabId = tab.getAttribute('data-tab');
    
    tabs.forEach(t => t.classList.remove('active'));
    tab.classList.add('active');
    
    tabContents.forEach(content => {
      if (content.id === tabId) {
        content.style.display = 'block';
      } else {
        content.style.display = 'none';
      }
    });
  });
});

通過以上步驟，就可以實現一個簡潔的選項卡效果。點擊不同的選項卡按鈕時，對應的內容會顯示出來，其他選項卡內容會隱藏起來。