簡體   English   中英

如何禁用“一個鏈接”上的鏈接顏色更改?

[英]How can I disable link color change on ONE LINK?

我有一個按鈕,我希望文本字體的顏色為紅色,但它仍為灰色,因為之前已單擊它。 如何禁用此鏈接的鏈接顏色更改?

index.html.erb

 <button class="button"><%= link_to 'New Value', new_value_path %></button> 

values.css.scss

 .button { padding: 10px 15px; background: #4479BA; color: #FF0000; } 

scaffolds.css.scss

 body { background-color: #fff; color: #333; font-family: verdana, arial, helvetica, sans-serif; font-size: 13px; line-height: 18px; } p, ol, ul, td { font-family: verdana, arial, helvetica, sans-serif; font-size: 13px; line-height: 18px; } pre { background-color: #eee; padding: 10px; font-size: 11px; } a { color: #000; &:visited { color: #666; } &:hover { color: #fff; background-color: #000; } } div { &.field, &.actions { margin-bottom: 10px; } } #notice { color: green; } .field_with_errors { padding: 2px; background-color: red; display: table; } #error_explanation { width: 450px; border: 2px solid red; padding: 7px; padding-bottom: 0; margin-bottom: 20px; background-color: #f0f0f0; h2 { text-align: left; font-weight: bold; padding: 5px 5px 5px 15px; font-size: 12px; margin: -7px; margin-bottom: 0px; background-color: #c00; color: #fff; } ul li { font-size: 12px; list-style: square; } } 

那是無效的 HTML- anchor不能在button

最好的選擇是將anchor樣式設置為類似於button

 .btn { background: #3498db; background-image: -webkit-linear-gradient(top, #3498db, #2980b9); background-image: -moz-linear-gradient(top, #3498db, #2980b9); background-image: -ms-linear-gradient(top, #3498db, #2980b9); background-image: -o-linear-gradient(top, #3498db, #2980b9); background-image: linear-gradient(to bottom, #3498db, #2980b9); -webkit-border-radius: 28; -moz-border-radius: 28; border-radius: 28px; font-family: Arial; color: #ffffff; font-size: 20px; padding: 10px 20px 10px 20px; text-decoration: none; } .btn:hover { background: #3cb0fd; background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db); background-image: -moz-linear-gradient(top, #3cb0fd, #3498db); background-image: -ms-linear-gradient(top, #3cb0fd, #3498db); background-image: -o-linear-gradient(top, #3cb0fd, #3498db); background-image: linear-gradient(to bottom, #3cb0fd, #3498db); text-decoration: none; } .btn:active{ color:red; } 
 <a href="" class="btn">I'm a button</a> 

使用了css3buttongenerator中的樣式,並添加了.btn:active以便在單擊並.btn:active anchor時添加一些樣式(注意color:red )。

還是要使button的行為像anchor - 如何創建像鏈接的HTML按鈕?

更新資料

要將它與rails link_to helper一起使用,請按以下方式使用它:

<%= link_to "I'm a button", new_value_path, class: 'btn' %>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM