displayプロパティを使ったリンクのテクニック
テキストリンクをボタンのように見せるには、displayプロパティが便利です。
displayプロパティとは、要素をインライン要素とするかブロックレベル要素とするかを指定する機能を持ちます。
リンクに使われるa要素はインライン要素なのですが、displayプロパティを使ってブロックレベル要素に変換することで、リンク文字だけでなく「コンテンツを表示する領域」であるブロック全体にリンクの機能をつけることができるようになります。
【displayプロパティ】
displayプロパティは、ブロックレベル・インラインレベルなどの「要素の表示形式」を指定するプロパティです。
▼値
none
指定した要素を表示しないように指定する。
block
指定された要素がブロックレベルになる。
inline
指定された要素がインラインになる。
以下の「HTML」「CSS」それぞれのタブをクリックすると、コードを確認することができます。