iT邦幫忙

0

Html button問題,初學者勿噴~~~感謝各位

想要做一個類似下圖的按紐https://ithelp.ithome.com.tw/upload/images/20210821/20140891zhy3ErtBpN.png
這張的信箱https://ithelp.ithome.com.tw/upload/images/20210821/20140891qKHXnOTRSm.png
這張的購物籃

遇到的問題:
1.不會把圖變成按鈕(網路上基本都是按鈕改背景)
2.按紐不會放到右上角
3.跟我的LOGO圖還有文字都不對齊(希望logo 文字 按鈕統一對齊底部)
以下是練習時的慘狀:
https://ithelp.ithome.com.tw/upload/images/20210821/20140891LHfSIFwDIG.png

看更多先前的討論...收起先前的討論...
哈囉~我也是剛學幾個月的菜鳥,能加FB一起交流嗎?
lingting iT邦新手 5 級 ‧ 2021-08-22 22:21:02 檢舉
可以呀,給我FB >w<
建議多練練 CSS 的語法,基本上如果沒有表單事件,可以直接用 CSS 模仿 按鈕
如果有表單事件,才去改 表單物件 的 CSS 語法,另外建議都是初心者
那不如直接找一個 前端框架來學習上手,花的時間其實都差不了多少
例如 BOOTSTRAP,這算是最多人用的,他也有一堆JQ套件可用
基本上對開發網站可以提升非常多的效率
Yaowen iT邦新手 4 級 ‧ 2021-08-23 10:16:48 檢舉
我覺得學asp.net 架構 View的部分建議使用BOOTSTRAP...
lingting iT邦新手 5 級 ‧ 2021-08-23 13:19:52 檢舉
好的,感謝各位><
2
㊣浩瀚星空㊣
iT邦超人 1 級 ‧ 2021-08-22 07:03:14
最佳解答

1.不會把圖變成按鈕(網路上基本都是按鈕改背景)

<button type="button"><i class="fa fa-fb"></i>狂</button>
<a href=""><img src="" /></a>

以上是基本的,當然還有更進階的,請自行GOOGLE了

2.按紐不會放到右上角

<style>
.rtop{
    position: absolute;
    top: 0;    
    right: 0;    
}
</style>

<button class="rtop"></buton>

上面是基本的。如果不會的話,請查看CSS。
網路上很多這樣的教學。畢竟這些是簡單基本的

3.跟我的LOGO圖還有文字都不對齊(希望logo 文字 按鈕統一對齊底部)

這是我不太想回答

結論:
總之,你的問題都是很基本的東西。大多數都是CSS調整有關。
而這些都是網路上隨便找就一堆教學。
雖然你說了勿噴。

但你的作為跟表現實在是很......
好啦!算了,你都說勿噴了..我也點到為止就好。
其它加油了

lingting iT邦新手 5 級 ‧ 2021-08-22 11:55:11 檢舉

謝謝您,有特別推薦的教學網站嗎><,因為我關鍵字,常常找不到需要的東西TT

newkevin iT邦高手 1 級 ‧ 2021-08-23 08:17:07 檢舉

你用過那些關鍵字阿

lingting iT邦新手 5 級 ‧ 2021-08-23 13:19:32 檢舉

我查CSS BUTTON 圖按鈕,還有html如何圖文底部對齊

0
  1. 圖片變按紐 <img src="" onclick=""> 裝圖, onclick後面寫js的function,即可當按紐,或使用id後至js製作onclick function。
  2. 你要放哪的右上角,黑色bar最右邊??
  3. 建議你放出你的前端程式碼....沒人知道你寫了什麼很難判斷~放程式碼時請使用下圖紅框之功能

https://ithelp.ithome.com.tw/upload/images/20210822/20135501EtyjYRA2UB.jpg

lingting iT邦新手 5 級 ‧ 2021-08-22 11:58:06 檢舉

<h1><img src="~/Img/LOGO.png" width="70" height="70">ABC影音網站<button type="button" style="width:60px;height:60px;"><img src="~/Img/fb.png" width="90" height="90"></button></h1>

上面是我的程式碼
右上角指的是LOGO跟文字最右邊

1
海綿寶寶
iT邦大神 1 級 ‧ 2021-08-22 10:51:11
lingting iT邦新手 5 級 ‧ 2021-08-22 11:56:12 檢舉

感謝您><

我要發表回答

立即登入回答