不拉伸的滑块宽度和高度
Slider width and height without stretching
我正在为我的一个朋友开发一个网站。只有一个问题。如果不拉伸，滑块将无法放入框架中。
我已将其设置为 100% 高度，但它不起作用。 （它也有反应）
我希望它是原始宽度和高度（100x100、200x200 等）的漂亮图像，无需拉伸 (200x500)。
我希望你们能帮我解决这个问题。
我试了很多，也问过其他人，但他们帮不了我。
您可以在此处看到滑块。
http://tinyurl.com/p36hz6u
这是另一个版本的滑块，但在这个版本中，滑块图像被截断了
http://tinyurl.com/nfjjvwu
首先，我要做的是删除：background-size: 100% 100% 并添加 background-position: center center。
然后我会在容器中添加一个 background-color: white 。这会让它看起来更好，而且会居中。
如果图片是背景图片，请考虑使用 background-size:contain;，这样图片可以在不拉伸的情况下放大到 visible/possible，然后您可以使用 background-position
如果幻灯片有实际的物理 <img /> 标签，我制作了一个 JSfiddle 来演示将在元素中包含图像的代码。在此示例中，<div> 标记代表浏览器 window 并且可以调整大小：http://jsfiddle.net/dds27w2y/
我正在为我的一个朋友开发一个网站。只有一个问题。如果不拉伸，滑块将无法放入框架中。
我已将其设置为 100% 高度，但它不起作用。 （它也有反应） 我希望它是原始宽度和高度（100x100、200x200 等）的漂亮图像，无需拉伸 (200x500)。
我希望你们能帮我解决这个问题。 我试了很多，也问过其他人，但他们帮不了我。
您可以在此处看到滑块。 http://tinyurl.com/p36hz6u
这是另一个版本的滑块，但在这个版本中，滑块图像被截断了 http://tinyurl.com/nfjjvwu
首先，我要做的是删除：background-size: 100% 100% 并添加 background-position: center center。
然后我会在容器中添加一个 background-color: white 。这会让它看起来更好，而且会居中。
如果图片是背景图片，请考虑使用 background-size:contain;，这样图片可以在不拉伸的情况下放大到 visible/possible，然后您可以使用 background-position
如果幻灯片有实际的物理 <img /> 标签，我制作了一个 JSfiddle 来演示将在元素中包含图像的代码。在此示例中，<div> 标记代表浏览器 window 并且可以调整大小：http://jsfiddle.net/dds27w2y/