リンクの表示・装飾 (HTML,CSS,JavaScript)

新規ウインドウを開くリンクを区別できるようにするリンクを作るa要素に「target="_blank"」という属性（値）を加えることで、リンク先を新規ウインドウで開くよう指示することができます。 しかし、「target属性が使われているリンク」も「使われていないリンク」も、ブラウザ上の表示は同じ...続きを読む

【ここは記事の1ページ目】現在のページをブラウザの履歴に残さないようにする通常、リンクをたどって次のページに移動しても、ブラウザの「戻る」ボタンを押せば、元のページに戻る（再表示する）ことができます。しかし、特殊なリンク方法を使えば、次のページに移動した後で「戻る」ボタンを押しても、そのページ...続きを読む

リンクをデザインする以下の3つのリンクにマウスを載せてみて下さい。 一見、サイト名部分だけがリンクのように見えますが、実際には周辺の余白も含めて、上下の文字列全体がリンクになっています。 いまオススメの素材やその使い方など、Web素材のお役立ち情報を紹介 All About...続きを読む

div.sourcecode { background-color: #eeeeee; padding: 4px 4px 4px 20px; margin: 12px; line-height: 1.4; font-family: monospace; } div.samplearea { ...続きを読む

div.sourcecode { background-color: #eeeeee; padding: 4px 4px 4px 20px; margin: 12px; line-height: 1.4; font-family: monospace; }メニューやリンクリストに活用するとお...続きを読む

div.sourcecode { background-color: #eeeeee; padding: 4px 4px 4px 20px; margin: 12px; line-height: 1.4; font-family: monospace;}div.testground { mar...続きを読む

div.sourcecode { border: 2px #eeeeee solid; background-color: #eeeeee; padding: 0.5em; font-family: monospace; }span.sourcecode { font-family: mono...続きを読む

リンク先がHTMLとは限らない通常のウェブページへのリンクだと思ってクリックしてみたら、実はPDFファイルで、Acrobat Readerが起動してしまった……というような経験はありませんか？急いでいるときにそうなると、腹が立ってしまう人も居そうです。そこで今回は、リンクをクリックしたときに、...続きを読む

押し下がるのはボタンだけじゃないボタンはクリックすると押し下がりますね。 しかし、テキストリンクや画像リンクでは、ボタンのように押し下がったりしません。では、この サンプルリンク の上にマウスを乗せてみて下さい。どうでしょうか？リンクになっているテキストがちょっとだけ押し下がりませんでしたか？...続きを読む

クリックできる面積を増やそうまずは、下記のリンクサンプルをご覧下さい。普通のリンクですね。クリック可能なのは、タイトル部分だけです。 ...続きを読む