Q&A
三つめの奴って<a style="text-decoration: none; color:000;"をCSSに記述するときは、.a{text-decor~}か、h1{text-decor~}どっちですか?
ページ移動のためにｈ1をボタンにしたいです。
どのようにすればいいのか教えてください。
回答4件
0
何らかの背景があるのでしょうが、
h1タグは**『見出し』**を表現したい場合に使います。
この表現を保ちつつ、ボタン化することは厳しいと思います。
例えば、ボタンをh1の箇所ではなく、別の場所に実装する、ということは出来ないでしょうか？
投稿2015/09/13 20:47
総合スコア1124
0
http://jsdo.it/katoy/8Ipe にいくつかの例をつくってみました。
html
html
1<h1>一覧ページへ</h1> 2 3<h1 class="box"><a href="http://jsdo.it/katoy/">一覧ページへ</a></h1> 4<br> 5 6<button class="btn btn-lg"><a href="http://jsdo.it/katoy/">一覧ページへ</a></button> 7<br><br> 8 9<a href="http://jsdo.it/katoy/"><button class="btn btn-lg">一覧ページへ</button></a> 10<br><br>
css
css
1* { 2 margin: 10px; 3 padding: 10px; 4 border: 10px; 5} 6 7body { 8 background: #fff; 9} 10 11.box { 12 -webkit-border-radius:10px; 13 -moz-border-radius:10px; 14 border-radius:10px; 15 background: rgb(221, 221, 221); 16}
参考情報
- bootstrap button http://getbootstrap.com/css/#buttons-sizes
- CSS3 のborder-radius で角丸を作る方法 http://www.webantena.net/css/css3-border-radius/
投稿2015/09/13 09:12
総合スコア22324
0
bootstrapを使うと、<h1 class="btn">で見た目がボタンになると思います。
自前のCSSでもできると思います。
ページ移動するならaタグで囲むか、jsでクリック時に飛ばすか。
投稿2015/09/13 03:54
総合スコア962
0
ベストアンサー
どのような、ものを望んでいるのかよくわかりませんが、一応3パターン用意してみました。
①h1の大きさのリンク
html
1<head> 2 <body> 3 <h1>ただのh1</h1> 4 <h1><a href="about:blank">リンクのh1</a></h1> 5 </body> 6</head>
②下線がないh1の大きさのリンク
html
1<head> 2 <body> 3 <h1>ただのh1</h1> 4 <h1><a style="text-decoration: none;" href="about:blank">リンクのh1</a></h1> 5 </body> 6</head>
③見た目はh1。けれどリンクの文字列
html
1<head> 2 <body> 3 <h1>ただのh1</h1> 4 <h1><a style="text-decoration: none; color:000;" href="about:blank">リンクのh1</a></h1> 5 </body> 6</head>
3パターンともh1の中にリンクを入れているのが基本的な形です。
これで、思うにお望みのデザインにできるのではないでしょうか？
投稿2015/09/13 03:41
編集2015/09/13 03:48
退会済みユーザー
総合スコア0
aのスタイルに設定してるので、
.a{text-decor~}
になります。
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。