首頁(yè) 猿問(wèn) 在我的選項(xiàng)卡中將顯示從塊設(shè)置為無(wú)

在我的選項(xiàng)卡中將顯示從塊設(shè)置為無(wú)

JavaScript

呼如林 2023-11-11 16:12:17

這是我的第一篇文章，我希望你能幫助我。我有這段代碼，但我試圖將每個(gè)選項(xiàng)卡的顯示從塊設(shè)置為無(wú)。例如，如果我單擊 CM，它應(yīng)該將 table-2 的顯示更改為 display:block; 并將其他2個(gè)的顯示設(shè)置為none，并將size-guide__tabs--在我選擇的一個(gè)中選擇。我嘗試了一些 Javascript，但我對(duì)它很陌生，所以我沒(méi)有成功。我知道我問(wèn)了你很多，但一個(gè)例子足以讓我嘗試自己解決剩下的部分。<div class="content-asset"> <link rel="stylesheet" href="https://content.hbc.com/chad/bay/editorial/plugins/saksoff5th/size-guide/off5th-size-guide-template-0000-00-00-main-2.0.1.css"> <div id="dsg-editorial" class="dsg-editorial dsg-en"> <section class="size-guide"> <div class="size-guide__tabs"> <div class="size-guide__tabs--header"> <div class="size-guide__tabs--header-left"> <a href="#" class="size-guide__tabs-1 size-guide__tabs--selected"> <span>Measurements</span> </a> <a href="#" class="size-guide__tabs-2"> <span>Size Conversion</span> </a> </div> <div class="size-guide__tabs--header-right" style="display: flex;"> <a href="#" class="size-guide__tabs--inches size-guide__tabs--selected"> <span>IN</span> </a> <a href="#" class="size-guide__tabs--centimiters"> <span>CM</span> </a> </div> </div> <div class="size-guide__tabs--content"> <div class="size-guide__table size-guide__table-1" style="display: block;"> <div class="size-guide__table--mobile"> <div class="size-guide__table--header"> <div class="table__row-cell-1">Alpha</div> </div>

查看完整描述

4 回答

有只小跳蛙

TA貢獻(xiàn)1824條經(jīng)驗(yàn) 獲得超8個(gè)贊

您可以簡(jiǎn)單地通過(guò)所需的 HTML 改進(jìn)和 Javascript 代碼來(lái)實(shí)現(xiàn)這一點(diǎn)。

此 JS 代碼將同時(shí)處理所有 3 個(gè)表的切換。:)

const cmClass = "size-guide__tabs--centimiters";

const inClass = "size-guide__tabs--inches";

const selected = "size-guide__tabs--selected"

const measureClass = "size-guide__tabs-1";

const sizeClass = "size-guide__tabs-2"

var inTable = document.getElementsByClassName("size-guide__table-1");

var cmTable = document.getElementsByClassName("size-guide__table-2");

var sizeTable = document.getElementsByClassName("size-guide__table-3");

var cmToggle = document.getElementsByClassName(cmClass);

var inToggle = document.getElementsByClassName(inClass);

var sizeToggle = document.getElementsByClassName(sizeClass);

var measureToggle = document.getElementsByClassName(measureClass);

function toggleMeasure(elm) {

if (elm.classList.contains(cmClass)) {

cmTable[0].style.display = 'block';

inTable[0].style.display = 'none';

sizeTable[0].style.display = 'none';

cmToggle[0].classList.add(selected);

inToggle[0].classList.remove(selected);

} else if (elm.classList.contains(inClass) || elm.classList.contains(measureClass)) {

inTable[0].style.display = 'block';

cmTable[0].style.display = 'none';

sizeTable[0].style.display = 'none';

inToggle[0].classList.add(selected);

cmToggle[0].classList.remove(selected);

measureToggle[0].classList.add(selected);

sizeToggle[0].classList.remove(selected);

} else if (elm.classList.contains(sizeClass)) {

cmTable[0].style.display = 'none';

inTable[0].style.display = 'none';

sizeTable[0].style.display = 'block';

inToggle[0].classList.add(selected);

cmToggle[0].classList.remove(selected);

sizeToggle[0].classList.add(selected);

measureToggle[0].classList.remove(selected);

}

<span>Measurements</span>

</a>

<span>Size Conversion</span>

</a>

</div>

</a>

</a>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-4">Natural Waist</div>

<div class="table__row-cell-5">Low Waist</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-4">Natural Waist</div>

<div class="table__row-cell-5">Low Waist</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-3">France</div>

<div class="table__row-cell-4">Italy</div>

<div class="table__row-cell-6">Japan</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</section>

</div>

反對(duì) 回復(fù) 2023-11-11

慕婉清6462132

TA貢獻(xiàn)1804條經(jīng)驗(yàn) 獲得超2個(gè)贊

為什么有四個(gè)按鈕，但只顯示三個(gè)表格？

let tabs = document.querySelectorAll('.size-guide__tabs--header-left a');

let tabs_ = document.querySelectorAll('.size-guide__tabs--header-right a');

let blocks = document.querySelectorAll('.size-guide__table');

Array.from(tabs).forEach(function(tab, index) {

tab.onclick = function() {

Array.from(tabs).forEach(tab => tab.classList.remove('size-guide__tabs--selected'));

this.classList.add('size-guide__tabs--selected');

Array.from(blocks).forEach(block => block.classList.remove('size-guide__table_active'));

blocks[index].classList.add('size-guide__table_active');

}

});

Array.from(tabs_).forEach(function(tab_, index) {

tab_.onclick = function() {

Array.from(tabs_).forEach(tab_ => tab_.classList.remove('size-guide__tabs--selected'));

this.classList.add('size-guide__tabs--selected');

Array.from(blocks).forEach(block => block.classList.remove('size-guide__table_active'));

blocks[2].classList.add('size-guide__table_active');

}

});

.size-guide__table {

display: none!important;

}

.size-guide__table_active {

display: block!important;

}

<span>Measurements</span>

</a>

<span>Size Conversion</span>

</a>

</div>

</a>

</a>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-4">Natural Waist</div>

<div class="table__row-cell-5">Low Waist</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-4">Natural Waist</div>

<div class="table__row-cell-5">Low Waist</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-3">France</div>

<div class="table__row-cell-4">Italy</div>

<div class="table__row-cell-6">Japan</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</section>

</div>

反對(duì) 回復(fù) 2023-11-11

qq_遁去的一_1

TA貢獻(xiàn)1725條經(jīng)驗(yàn) 獲得超8個(gè)贊

可以通過(guò)data向要定位的 html 元素添加屬性來(lái)實(shí)現(xiàn)。

在你的例子中我添加了data-target屬性。

在您的 html 中，我刪除了span tag內(nèi)部元素a以避免單擊目標(biāo)元素時(shí)發(fā)生事件冒泡并指定了 data-attribute. 我還size-guide__tab向所有選項(xiàng)卡添加了一個(gè)類(lèi)，以便我可以在 js 中定位它們。全部適用于選項(xiàng)卡Measurement, Size Conversion, IN, and CM。

CM

</a>

然后我還將該data-target屬性添加到尺寸指南表中。

//...

</div>

最后，添加腳本

const tabs = document.querySelectorAll('.size-guide__tab');

const tables = document.querySelectorAll('.size-guide__table');

tabs.forEach((tab) => {

tab.addEventListener('click', (e) => {

const targetName = e.target.dataset.target;

const parent = e.target.parentElement;

const targetTable = document.querySelector(`div[data-target=${targetName}]`);

// remove the size-guide__tabs--selected class on all children then attach to only clicked tab

Array.from(parent.children).forEach(child => child.classList.remove('size-guide__tabs--selected'));

//attach class to clicked tab

e.target.classList.add('size-guide__tabs--selected');

// since you only have the IN and CM options, we need to make sure that the target

table exists

if (targetTable) {

// hide all table guide

tables.forEach(table => table.style.display = 'none');

// then show only the target table

targetTable.style.display = 'block';

}

});

Measurement

</a>

Size Conversion

</a>

</div>

IN

</a>

CM

</a>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-4">Natural Waist</div>

<div class="table__row-cell-5">Low Waist</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-4">Natural Waist</div>

<div class="table__row-cell-5">Low Waist</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div class="table__row-cell-1">Alpha</div>

<div class="table__row-cell-3">France</div>

<div class="table__row-cell-4">Italy</div>

<div class="table__row-cell-6">Japan</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</section>

</div>

您可以在此處查看演示

反對(duì) 回復(fù) 2023-11-11

慕后森

TA貢獻(xiàn)1802條經(jīng)驗(yàn) 獲得超5個(gè)贊

這是您需要的：

添加一類(lèi)在除單擊的選項(xiàng)卡之外的所有選項(xiàng)卡上不顯示。
至于這個(gè)演示，我添加了onclick3 個(gè)元素只是為了演示

function openTab(tab) {  let tables = document.querySelectorAll(".size-guide__table");
  tables.forEach((table)=> {
    table.classList.add("displayNone");
  });  
  document.getElementById(tab).classList.add("displayBlock");  document.getElementById(tab).classList.remove("displayNone");
}

.displayBlock {  display: block !important;
}.displayNone{  display: none !important;
}

<div class="content-asset">
  <link rel="stylesheet" href="https://content.hbc.com/chad/bay/editorial/plugins/saksoff5th/size-guide/off5th-size-guide-template-0000-00-00-main-2.0.1.css">
  <div id="dsg-editorial" class="dsg-editorial dsg-en">
    <section class="size-guide">
      <div class="size-guide__tabs">
        <div class="size-guide__tabs--header">
          <div class="size-guide__tabs--header-left">
            <a href="#" class="size-guide__tabs-1 size-guide__tabs--selected">
              <span>Measurements</span>
            </a>
            <a href="#" class="size-guide__tabs-2" onclick="openTab('table_1')">
              <span>Size Conversion</span>
            </a>
          </div>
          <div class="size-guide__tabs--header-right" style="display: flex;">
            <a href="#" class="size-guide__tabs--inches size-guide__tabs--selected"  onclick="openTab('table_2')">
              <span>IN</span>
            </a>
            <a href="#" class="size-guide__tabs--centimiters"  onclick="openTab('table_3')">
              <span>CM</span>
            </a>
          </div>
        </div>
        <div class="size-guide__tabs--content">
          <div class="size-guide__table displayBlock size-guide__table-1" id="table_1">
            <div class="size-guide__table--mobile">
              <div class="size-guide__table--header">
                <div class="table__row-cell-1">Alpha</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XS</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XL</div>
              </div>
            </div>
            <div class="size-guide__table--container">
              <div class="size-guide__table--header">
                <div class="table__row-cell-1">Alpha</div>
                <div class="table__row-cell-2">Size</div>
                <div class="table__row-cell-3">Bust</div>
                <div class="table__row-cell-4">Natural Waist</div>
                <div class="table__row-cell-5">Low Waist</div>
                <div class="table__row-cell-6">Hips</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XS</div>
                <div class="table__row-cell-2">2</div>
                <div class="table__row-cell-3">32" - 32.5"</div>
                <div class="table__row-cell-4">24" - 25"</div>
                <div class="table__row-cell-5">24" - 25"</div>
                <div class="table__row-cell-6">35"</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
                <div class="table__row-cell-2">4</div>
                <div class="table__row-cell-3">33.5" - 34"</div>
                <div class="table__row-cell-4">25" - 26"</div>
                <div class="table__row-cell-5">25" - 26"</div>
                <div class="table__row-cell-6">36"</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
                <div class="table__row-cell-2">6</div>
                <div class="table__row-cell-3">34.5" - 35"</div>
                <div class="table__row-cell-4">26" - 27"</div>
                <div class="table__row-cell-5">26" - 27"</div>
                <div class="table__row-cell-6">37"</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
                <div class="table__row-cell-2">8</div>
                <div class="table__row-cell-3">35.5" - 36"</div>
                <div class="table__row-cell-4">27" - 28"</div>
                <div class="table__row-cell-5">27" - 28"</div>
                <div class="table__row-cell-6">38"</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
                <div class="table__row-cell-2">10</div>
                <div class="table__row-cell-3">36.5" - 37"</div>
                <div class="table__row-cell-4">28" - 29"</div>
                <div class="table__row-cell-5">28" - 29"</div>
                <div class="table__row-cell-6">39"</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
                <div class="table__row-cell-2">12</div>
                <div class="table__row-cell-3">37.5" - 38"</div>
                <div class="table__row-cell-4">29.5" - 30.5"</div>
                <div class="table__row-cell-5">29.5" - 30.5"</div>
                <div class="table__row-cell-6">40.5"</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
                <div class="table__row-cell-2">14</div>
                <div class="table__row-cell-3">38.5" - 39.5"</div>
                <div class="table__row-cell-4">31" - 32"</div>
                <div class="table__row-cell-5">31" - 32"</div>
                <div class="table__row-cell-6">42"</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XL</div>
                <div class="table__row-cell-2">16</div>
                <div class="table__row-cell-3">41.5" - 42.5"</div>
                <div class="table__row-cell-4">32.5" - 33.5"</div>
                <div class="table__row-cell-5">32.5" - 33.5"</div>
                <div class="table__row-cell-6">43.5"</div>
              </div>
            </div>
          </div>
          <div class="size-guide__table displayBlock size-guide__table-2" id="table_2">
            <div class="size-guide__table--mobile">
              <div class="size-guide__table--header">
                <div class="table__row-cell-1">Alpha</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XS</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XL</div>
              </div>
            </div>
            <div class="size-guide__table--container">
              <div class="size-guide__table--header">
                <div class="table__row-cell-1">Alpha</div>
                <div class="table__row-cell-2">Size</div>
                <div class="table__row-cell-3">Bust</div>
                <div class="table__row-cell-4">Natural Waist</div>
                <div class="table__row-cell-5">Low Waist</div>
                <div class="table__row-cell-6">Hips</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XS</div>
                <div class="table__row-cell-2">2</div>
                <div class="table__row-cell-3">81 - 82.5</div>
                <div class="table__row-cell-4">61 - 63.5</div>
                <div class="table__row-cell-5">61 - 63.5</div>
                <div class="table__row-cell-6">89</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
                <div class="table__row-cell-2">4</div>
                <div class="table__row-cell-3">85 - 86.5</div>
                <div class="table__row-cell-4">63.5 - 66</div>
                <div class="table__row-cell-5">63.5 - 66</div>
                <div class="table__row-cell-6">91.5</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
                <div class="table__row-cell-2">6</div>
                <div class="table__row-cell-3">87.5 - 89</div>
                <div class="table__row-cell-4">66 - 68.5</div>
                <div class="table__row-cell-5">66 - 68.5</div>
                <div class="table__row-cell-6">94</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
                <div class="table__row-cell-2">8</div>
                <div class="table__row-cell-3">90 - 91.5</div>
                <div class="table__row-cell-4">68.5 - 71</div>
                <div class="table__row-cell-5">68.5 - 71</div>
                <div class="table__row-cell-6">96.5</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
                <div class="table__row-cell-2">10</div>
                <div class="table__row-cell-3">92.5 - 94</div>
                <div class="table__row-cell-4">71 - 73.5</div>
                <div class="table__row-cell-5">71 - 73.5</div>
                <div class="table__row-cell-6">99</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
                <div class="table__row-cell-2">12</div>
                <div class="table__row-cell-3">95 - 96.5</div>
                <div class="table__row-cell-4">75 - 77.5</div>
                <div class="table__row-cell-5">75 - 77.5</div>
                <div class="table__row-cell-6">103</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
                <div class="table__row-cell-2">14</div>
                <div class="table__row-cell-3">98 - 100</div>
                <div class="table__row-cell-4">79 - 81</div>
                <div class="table__row-cell-5">79 - 81</div>
                <div class="table__row-cell-6">106.5</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XL</div>
                <div class="table__row-cell-2">16</div>
                <div class="table__row-cell-3">105 - 108</div>
                <div class="table__row-cell-4">82.5 - 85</div>
                <div class="table__row-cell-5">82.5 - 85</div>
                <div class="table__row-cell-6">110.5</div>
              </div>
            </div>
          </div>
          <div class="size-guide__table displayBlock size-guide__table-3" id="table_3">
            <div class="size-guide__table--mobile">
              <div class="size-guide__table--header">
                <div class="table__row-cell-1">Alpha</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XXS</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XS</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XS</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XL</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XXL</div>
              </div>
            </div>
            <div class="size-guide__table--container">
              <div class="size-guide__table--header">
                <div class="table__row-cell-1">Alpha</div>
                <div class="table__row-cell-2">US Size</div>
                <div class="table__row-cell-3">France</div>
                <div class="table__row-cell-4">Italy</div>
                <div class="table__row-cell-5">UK</div>
                <div class="table__row-cell-6">Japan</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XXS</div>
                <div class="table__row-cell-2">00</div>
                <div class="table__row-cell-3">30</div>
                <div class="table__row-cell-4">34</div>
                <div class="table__row-cell-5">2</div>
                <div class="table__row-cell-6">1</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XS</div>
                <div class="table__row-cell-2">0</div>
                <div class="table__row-cell-3">32</div>
                <div class="table__row-cell-4">36</div>
                <div class="table__row-cell-5">4</div>
                <div class="table__row-cell-6">3</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XS</div>
                <div class="table__row-cell-2">2</div>
                <div class="table__row-cell-3">34</div>
                <div class="table__row-cell-4">38</div>
                <div class="table__row-cell-5">6</div>
                <div class="table__row-cell-6">5</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">S</div>
                <div class="table__row-cell-2">4</div>
                <div class="table__row-cell-3">36</div>
                <div class="table__row-cell-4">40</div>
                <div class="table__row-cell-5">8</div>
                <div class="table__row-cell-6">7</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
                <div class="table__row-cell-2">6</div>
                <div class="table__row-cell-3">38</div>
                <div class="table__row-cell-4">42</div>
                <div class="table__row-cell-5">10</div>
                <div class="table__row-cell-6">9</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">M</div>
                <div class="table__row-cell-2">8</div>
                <div class="table__row-cell-3">40</div>
                <div class="table__row-cell-4">44</div>
                <div class="table__row-cell-5">12</div>
                <div class="table__row-cell-6">11</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">L</div>
                <div class="table__row-cell-2">10</div>
                <div class="table__row-cell-3">42</div>
                <div class="table__row-cell-4">46</div>
                <div class="table__row-cell-5">14</div>
                <div class="table__row-cell-6">13</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XL</div>
                <div class="table__row-cell-2">12</div>
                <div class="table__row-cell-3">44</div>
                <div class="table__row-cell-4">48</div>
                <div class="table__row-cell-5">16</div>
                <div class="table__row-cell-6">15</div>
              </div>
              <div class="size-guide__table--row">
                <div class="table__row-cell-1">XXL</div>
                <div class="table__row-cell-2">14</div>
                <div class="table__row-cell-3">46</div>
                <div class="table__row-cell-4">50</div>
                <div class="table__row-cell-5">18</div>
                <div class="table__row-cell-6">17</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  </div>

工作小提琴

反對(duì) 回復(fù) 2023-11-11