css3 - 純css實現點擊特效
問題描述
怎么用純css實現和按鈕一樣的點擊一次,然后改變樣式?聽說是用偽元素target,不過我不知道怎么操作
問題解答
回答1:<style> #select{display:none; } .box{width:100px;height:100px;border:1px solid red;display:none; } #select:checked + .box{display:block; }</style><label for='select'>點我!</label><input type='checkbox' id='select'><p class='box'>盒子</p>
也可以看一下這篇文章:CSS實現點擊事件及實踐http://www.cnblogs.com/pssp/p...
回答2:點擊過的鏈接可以 :visited 。
回答3:visited的方法前面的小伙伴已經講了;那我還是幫你搞懂偽元素 target 的用法吧。學東西畢竟得踏踏實實,搞懂想要的再去學新的。:target偽選擇器指定的ID匹配上時,它的樣式就會在這個ID元素上生效。
HTML:
<h1 id='section1'>Section 1</h1>
CSS:
:target { color: #afafaf;}h1:target { color: #f00;}
ID為”section1″的元素將會變紅.
回答4:<!DOCTYPE html><html> <head><meta http-equiv='Content-Type' content='text/html; charset=UTF-8'><title>RunJS</title> <script type='text/javascript' src='http://www.aoyou183.cn/js/sandbox/other/CanvasText-0.4.1.js'></script><style>p{color:#fff;height:80px;width:220px;background-color:#abcdef;line-height:80px;text-align:center;}a:visited>p{ background:#000;}</style> </head> <body><a href='http://www.aoyou183.cn/wenda/5745.html#' >我是一個連接<p> 我是一個p</p></a> </body></html>
像這樣用visited然后可以控制a的子元素的樣式,+選擇器不支持,只支持hover、active。回答5:
貌似沒有類似jquery的toogleClass(不記得拼寫了)的功能吧,不過,倒是input有個checked屬性。你可以使用兄弟選擇器來設置,比如input+label和input:checked+label來區分,但是,這個明顯和你說的也不太一樣,這個其實是通過獲取焦點和失去焦點來判斷的。實在不行就用JS吧
回答6:現在css只有hover visited 才能監聽到鼠標滑動過的事件 要是點擊改變樣式 一般只能結合js來實現
回答7:jquery 的slideToggle
相關文章:
1. 一個mysql聯表查詢的問題2. mysql - 一個表和多個表是多對多的關系,該怎么設計3. 運行python程序時出現“應用程序發生異常”的內存錯誤?4. html5 - iOS的webview加載出來的H5網頁,怎么修改html標簽select的樣式字體?5. python如何不改動文件的情況下修改文件的 修改日期6. javascript - git clone 下來的項目 想在本地運行 npm run install 報錯7. java - 我現在一個servlet中有調用socket訪問,作為socket的客戶端,8. 主從備份 - 跪求mysql 高可用主從方案9. mysql主從 - 請教下mysql 主動-被動模式的雙主配置 和 主從配置在應用上有什么區別?10. python 如何實現PHP替換圖片 鏈接
