div 内のコンテンツが外部に出ています_html/css_WEB-ITnose-htmlチュートリアル-php.cn

div 内のコンテンツが外部に出ています_html/css_WEB-ITnose

WBOY

リリース： 2016-06-21 08:48:47

オリジナル

2946 人が閲覧しました

<script type="text/javascript">	$(document).ready(function() {		$(".flip").click(function() {			$(".panel").slideToggle("slow");		});		$(".flip2").click(function() {			$(".panel2").slideToggle("slow");		});	});</script><style type="text/css">div.panel, div.flip, div.panel2, div.flip2 {	margin: 0px;	padding: 5px;	text-align: center;	background: #e5eecc;	border: solid 1px #c3c3c3;}div.panel {	display: none;}div.panel2 {	display: none;}ul li {	list-style-type: none;}</style><body>	<ul>		<li>			<div				style="width: 10%; height: 20px; float: left; text-align: right; overflow: hidden;">例子1</div>			<div class="flip" style="width: 88%; height: 20px; float: right;">请点击这里</div>			<div class="panel" style="width: 88%; float: right;">				<p>W3School - 领先的 Web 技术教程站点</p>				<p>在 W3School，你可以找到你所需要的所有网站建设教程。</p>			</div>		</li>		<li>			<div				style="width: 10%; float: left; text-align: right; overflow: hidden;">例子2</div>			<div class="flip2" style="width: 88%; float: right;">请点击这里</div>			<div class="panel2" style="width: 88%; float: right;">				<p>W3School - 领先的 Web 技术教程站点</p>				<p>在 W3School，你可以找到你所需要的所有网站建设教程。</p>			</div>		</li>	</ul></body>

ログイン後にコピー

クリックして下にスライドしたい、この機能が実装されています。最初に「クリックしてください」をクリックしたdivが長くなってしまったのですが、divは固定されていましたが、中の文字がはみ出してしまいました。例 1 と例 2 の 2 つの div も同様です。どうすれば解決できますか? >ディスカッション (解決策) に返信

単語がわからず外に逃げてしまいました

試してみてください

ul li {

list-style-type: none; clear: Both;

言葉がわからず、外に逃げましたか? 列 1 をクリックするか、数回クリックすると見つかります

試してみましょう

ul li {

list-style-type: none;clear: Both;

いいえ

単語が見えず外に逃げましたああ

Liezi 1 をクリックするか、さらに数回クリックすると見つかります

写真を送って見てみましょう