亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

CSS邊框太高,高度不影響元素

CSS邊框太高,高度不影響元素

慕田峪9158850 2024-01-22 20:13:05
我有一個相當簡單的 HTML 結構?,F在這個元素的邊框太高了,我已經讀到只能通過改變元素的高度來改變它。但調整高度并不會改變任何東西。一定有一個相當簡單的解決方案。感謝您的幫助。.carFilter{    display:flex;    flex-direction:row;    align-items: center;    justify-content: center;}.boxyc{    padding:20px;      border-top:1px solid white;      border-bottom:1px solid white;      border-left:1px solid white;      border-right:1px solid white;    border-radius:5px;    background-color:#CCCCCC;    color:#999999;    display: inline-block;    font-size:150%;    margin:0;}.boxycx{    padding:20px;    align-items: center;    justify-content: center;    height:20%;    }<div class="carFilter"> <p class="boxycx">Bla Bla:</p> <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span> <span id="boxyc" class="boxyc"> <p class="vcxvcx">bla</p></span> <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span> <span id="boxyc" class="boxyc"> <p class="vcxvcx">bla</p></span> <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span> </div>
查看完整描述

3 回答

?
MMTTMM

TA貢獻1869條經驗 獲得超4個贊

margin:0;給班級一些p。


.carFilter {

  display: flex;

  flex-direction: row;

  align-items: center;

  justify-content: center;

  background: teal;

  padding: 10px;

}


.boxyc {

  border-top: 10px solid white;

  border-bottom: 10px solid white;

  border-left: 10px solid white;

  border-right: 10px solid white;

  border-radius: 5px;

  background-color: #CCCCCC;

  color: red;

  font-size: 1em;

  margin: 10px;

}


.vcxvcx {

  margin: 0;

}

<div class="carFilter">

  <p class="boxycx">Bla Bla:</p>

  <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span>

  <span id="boxyc" class="boxyc"> <p class="vcxvcx">bla</p></span>

  <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span>

  <span id="boxyc" class="boxyc"> <p class="vcxvcx">bla</p></span>

  <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span>

</div>


查看完整回答
反對 回復 2024-01-22
?
蠱毒傳說

TA貢獻1895條經驗 獲得超3個贊

填充(和彈性盒)設置高度。我將 boxyc 的內邊距更改為 5px 20px。調整以滿足您的需求。


.carFilter{

    display:flex;

    flex-direction:row;

    align-items: center;

    justify-content: center;

}


p {

  margin: 0;

}


.boxyc{

    padding:5px 20px;

      border-top:1px solid white;

      border-bottom:1px solid white;

      border-left:1px solid white;

      border-right:1px solid white;

    border-radius:5px;

    background-color:#CCCCCC;

    color:#999999;

    display: inline-block;

    font-size:150%;

    margin:0;

}


.boxycx{

    padding:20px;

    align-items: center;

    justify-content: center;

    height:20%;

    

}

<div class="carFilter">

 <p class="boxycx">Bla Bla:</p>

 <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span>

 <span id="boxyc" class="boxyc"> <p class="vcxvcx">bla</p></span>

 <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span>

 <span id="boxyc" class="boxyc"> <p class="vcxvcx">bla</p></span>

 <span id="boxyc" class="boxyc"><p class="vcxvcx">bla</p></span>

 </div>


查看完整回答
反對 回復 2024-01-22
?
手掌心

TA貢獻1942條經驗 獲得超3個贊

在 p 元素中添加 margin:0 解決了邊框/背景過大的問題。



查看完整回答
反對 回復 2024-01-22
  • 3 回答
  • 0 關注
  • 229 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號