台灣最大程式設計社群網站
線上人數
1294
 
會員總數:240331
討論主題:186333
歡迎您免費加入會員
討論區列表 >> CSS/HTML5/Bootstarp >> CSS網頁排版設計
[ 變換順序 ]  
[我要回覆]
1
回應主題 加入我的關注話題 檢舉此篇討論 將提問者加入個人黑名單
CSS網頁排版設計
價值 : 5 QP  點閱數:86 回應數:4

樓主

Tsai YA YA
門外漢
0 1
12 1
發送站內信

想要請問CSS橫向按鈕,版面設計width:1180PX,每顆按鈕width:166共七顆,按鈕中間有線border-right: 1px & border-left: 1px,這樣共1176px,
還有剩餘4px,請問這4px如何把它合在最後一顆按鈕裡,謝謝。




搜尋相關Tags的文章: [ CSS網頁排版設計 ] ,
本篇文章發表於2017-08-11 13:20
別忘捐VP感謝幫助你的人 新手會員瞧一瞧
1樓
最有價值解答

迷路
捐贈 VP 給 迷路 檢舉此回應
可用:last-child選擇器
http://www.w3school.com.cn/cssref/selector_last-child.asp
本篇文章回覆於2017-08-14 10:54
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
2樓
不錯的參考

浩瀚星空
捐贈 VP 給 浩瀚星空 檢舉此回應
如#1回答給你的。



用如上的css就可以達到你想要的。(div跟buttion請改成你的對應class,我這邊只是範例)
本篇文章回覆於2017-08-14 14:59
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
3樓
作者回應

Tsai YA YA
檢舉此回應
真的很抱歉,我是初學者,我一直放不進去那位大大所教的last-child選擇器,可以幫我看一下我的CSS嗎!!!

#menu {
background-image: url(images/menu~.jpg);
background-repeat: repeat-x;
height: 50px;
width: 1179px;
border-top-width: 1px;
border-right-width: 0px;
border-bottom-width: 1px;
border-left-width: 0px;
border-top-style: solid;
border-right-style: 0;
border-bottom-style: solid;
border-left-style: 0;
border-top-color: #BEBFC3;
border-bottom-color: #7B7777;
}

#menu ul {
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}

#menu ul li {
float: left;
list-style-type: none;
}

#menu ul li a {
font-size: 16pt;
line-height: 50px;
text-align: center;
display: block;
width: 166px;
border-right: 1px solid #999;
border-left: 1px solid #000;
color: #FFFFCC;
text-decoration: none;
font-weight: bold
}
#menu ul li a:hover {
font-size: 16pt;
line-height: 50px;
text-align: center;
display: block;
width: 166px;
border-right: 1px solid #999;
border-left: 1px solid #000;
color: #FFFF99;
background-image: url(images/menu~.jpg);
background-position: 0px -50px;
text-decoration: none;
font-weight: bold
}
本篇文章回覆於2017-08-15 10:11
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
4樓
回應

迷路
捐贈 VP 給 迷路 檢舉此回應
首先,請愛用程式標籤
再來,請先學習css的基礎,最起碼要看懂每行指令的意思
:hover是指滑鼠經過時,所以你完全沒必要重複設定相同的css內容
只需要列出要不同的部分即可,例如顏色、底圖等
「#menu ul li a」這是你的按鈕對吧?
那按照我和星空大的回覆再加上

本篇文章回覆於2017-08-16 09:29
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
[ 變換順序 ]   
1

回覆
如要回應,請先登入.