如何對齊複選框水平爲一的其他

快速的問題，我想知道是否有可能對準我的3個複選框的和水平有段落之一的其它替代方式，現在有哪個是垂直如何對齊複選框水平爲一的其他

感謝您的幫助

\t <div class="wrapper3"> 
 
\t <p>Do You Want Sound ?</p> 
 
\t <input type="checkbox" value="No" style="color: Black;" id="sound">Yes 
 
    <p>Do You want Flashes ?</p> 
 
    <input type="checkbox" value="No" style="color: Black;" id="flash">Yes 
 
    <p>Do You want Text ?</p> 
 
    <input type="checkbox" value="No" style="color: Black;" id="text">Yes 
 
    <br /> 
 
\t </div>

來源

2014-10-31 Jamiex304

使用'span'而不是'p'，因爲這些都不是段落。然後在他們之間換新線。 – vsync 2014-10-31 23:13:36

你應該使用'label'而不是'p'標籤......並且break標籤不應該用於間距。這是margin/padding的用處。 – 2014-10-31 23:18:07

我寧願使用適當的語義標記不內嵌CSS：

<div class="wrapper3"> 
    <p> 
    <strong>Do You Want Sound?</strong> 
    <label for="sound"> 
     <input type="checkbox" value="Yes" id="sound"> Yes 
    </label> 
    </p> 

    <p> 
    <strong>Do You want Flashes?</strong> 
    <label for="flash"> 
     <input type="checkbox" value="Yes" id="flash">Yes 
    </label> 
    </p> 

    <p> 
    <strong>Do You want Text?</strong> 
    <label for="text"> 
     <input type="checkbox" value="Yes" id="text">Yes 
    </label> 
    </p> 
</div>

下面是相關聯的CSS：

.wrapper3 p { 
    display : inline-block; 
    margin : 0; 
    padding : 1em; 
    border : none; 
} 

.wrapper3 label { 
    display : block; 
} 

.wrapper3 input { 
    color: #000; 
}

通過方式，你用「是」標記複選框，但thei r值表示「否」。我改變了我的代碼示例。這裏有一個plnkr

來源

2014-10-31 23:35:51 odiumediae

您可以輕鬆地做到這一點通過改變一起包裹你的一個<div>內段和複選框<p>標籤的財產至inline-block。這裏有一個演示：

p { 
 
    display: inline-block; 
 
}

<div class="wrapper3"> 
 
    <div> 
 
    <p>Do You Want Sound ?</p> 
 
    <input type="checkbox" value="No" style="color: Black;" id="sound">Yes</div> 
 
    <div> 
 
    <p>Do You want Flashes ?</p> 
 
    <input type="checkbox" value="No" style="color: Black;" id="flash">Yes</div> 
 
    <div> 
 
    <p>Do You want Text ?</p> 
 
    <input type="checkbox" value="No" style="color: Black;" id="text">Yes</div> 
 
    <br /> 
 
</div>

來源

2014-10-31 23:15:18

如何對齊複選框水平爲一的其他

回答

相關問題