根据可用宽度调整图像

Question

我正在创建一个旋转木马，我无法根据可用宽度的宽度显示图像。我的图像大约是350 x 250像素，我试图将它们拉伸以填满整个窗口

<style>
	.mainLeftContent
	{
		width: 80%;
	}
	.slider 
	{
		margin: 10px 0;
		width: 100%; /* Update to your slider width */
		height: auto; /* Update to your slider height */
		position: relative;
		overflow: hidden;
	}

	.slider li {
		display: none;
		position: absolute; 
		top: 0; 
		left: 0; 
	}
</style>

<div id ="mainLeftContent">
	<ul id="MainContentPlaceHolder_caruselUl" class="slider">
		<li><a href="Recipe.aspx?RecipeId=14013">
			<img class="caruselImageClass" src="../images/RecipeImages/635635997646632016.JPG" /></a>
		</li>
	</ul>
</div>

Answer 1

感谢您的时间。 我使用java脚本并动态设置.slider的宽度解决了我的问题。