ホームページ > 記事 > ウェブフロントエンド > CSS 特殊効果は HTML テーブルを実装してコンテンツの一部を表示し、マウスを上に動かすとコンテンツ全体が表示されます。 _html/css_WEB-ITnose
CSS 特殊効果は HTML テーブルを実装してコンテンツの一部を表示し、マウスを上に動かすとコンテンツ全体が表示されます。 _html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-21 08:55:532475ブラウズ
Web ページを作成する場合、データを表示するためにテーブルを使用することがよくありますが、1 つの TD にデータが多すぎると、テーブルの幅が狭くなり、ページ全体が統一されなくなります。は修正されましたが、コンテンツが表示されません。すべてが表示されます。どうすればよいですか? 今日、このような小さな問題に遭遇しました。今後必要になったときに参照できるよう、記録しておきます。
先上css代码:.newsInfo:hover { background: #eee; color: #333; z-index: 999;}.newsInfo { position: relative; z-index: 0;} .newsInfo span { display: none;} .newsInfo:hover span { display: block; position: absolute; min-width:400px; top: 28px; left:100px; border: 1px solid #cccccc; background: #C1CDC1; color: black; padding: 5px; text-align: left; overflow: hidden;}.newInfoTruncation { width:120px; white-space:nowrap; word-break:keep-all; overflow:hidden; text-overflow:ellipsis;} 然后html代码:<html><head> <link href="index.css" rel="Stylesheet" type="text/css" /></head><body> <div> <a href="#"class="newsInfo"> <div class="newInfoTruncation"> 参考消息网2月29日报道 韩媒称，中国正在迅速增强国防实力。去年年底和今年年初，中国先后采取了各种史无前例的强化军事力量的措施。有预测称，连续5年实现两位数增长的中国国防预算今年的涨幅将超出以往。 </div> <span> 参考消息网2月29日报道 韩媒称，中国正在迅速增强国防实力。去年年底和今年年初，中国先后采取了各种史无前例的强化军事力量的措施。有预测称，连续5年实现两位数增长的中国国防预算今年的涨幅将超出以往。 </span> </a> </div></body></html> 声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。