![](/img/trans.png)
[英]How can I change the color of the link, remove its underlining and resize it?
[英]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.