更新於 2021/04/14閱讀時間約 2 分鐘

HTML.CSS學習筆記02

01-圖片size寫法 background-size: 12px ; 當給一個數值的時候,另一個設定為auto 參考:https://developer.mozilla.org/zh-CN/docs/Web/CSS/background-size 02-圖片切換-方法1: css: .a123 a { background: url("123.png");/*預設顯示圖片*/ display: block; } .a123 a:hover { background: url("123.png"); } html: div class="a123"a href="#"/a/div 這樣就可以切換囉 參考來源:https://haoyue66.blogspot.com/2014/08/css.html 03-圖片切換-方法2 感恩TINA大大告訴我,不用a 用div也可以使用 :hover 參考如上,直接把內容div刪除 css: .a123 { background: url("123.png") } .a123:hover { background: url("123.png"); } html: div class="a123"/div 同理a:link, a:visited, a:hover, a:active都可以直接使用在div上
04-div可點擊連結事件 可點擊方式1-為a 超連記href a href="http://www.google.com" target="_blank" title="google"/a 方式2-onclick事件 div class="main-1" onclick="location.href='index.html';" 方式3-js寫入 我還不會QQ 等會了補充過來
分享至
成為作者繼續創作的動力吧!
© 2024 vocus All rights reserved.