crossline

▼CSS3 #title

font-size:12px;line-height: 150%;

overflow: hidden;

white-space: nowrap;

text-overflow: ellipsis;

 

テキストが自動的に多く表示されないようにする。

 

例えばHTML側でpに

あああああああああああああ

と書いたとしても、

「あああ・・・」と省略して表示してくれる!!

※3つで1セット!!

 

 

CSS

a:after(or before){

 content: attr(title);  /*imgタグに書かれているtitleを表示させる*/

}

 

HTML

<a href="○○.html" title="○○" ><img src="img/○○.png" alt="群れをなして空を飛ぶペンギンたちのイラスト">

 

 

※aにbefore afterをつければ、テキストの(contents)の位置を上か下か一括で管理する事ができる