二次DIV没有二次照片？ [英] Quadratic DIVs with not quadratic photos?

问题描述

你好，


我有我的照片博客上的照片很好的收藏，我创建了一个存档，同时显示最近50张左右的照片。


现在，我希望所有照片都显示在同一张照片中大小（虽然它们最初有不同的尺寸，有些是裁剪的，有些是风景，有些是肖像）。


是否可以通过使用CSS来挤压这些照片例如是二次形状而不会使照片变形？因此只有部分照片正在显示，另一部分被屏蔽了？


感谢任何提示！


Stef

解决方案

我不确定你的二次方形是什么意思，但我认为你可以通过设置一个固定的高度和宽度来至少将所有照片限制在一致的大小为图像然后隐藏溢出。我知道这在使用图像作为背景时有效...


这可能更像是一个缩略图。接近...


你能发布一些关于你要找的东西的更多描述吗？



Tom

我不是确定您的二次形状是什么意思，但我认为您可以通过为图像设置固定的高度和宽度然后隐藏溢出来至少将所有照片限制为一致的大小。

感谢花儿！是的，也许有不同的方法...事情是，我想在画廊中显示150x150px大小的照片。这意味着只显示部分照片，因为照片的相对大小在很多情况下是3：2而不是1：1。


这个隐藏溢出正是我认为它应该如何运作。但是我不知道怎么...


你能给我一些提示吗？！


非常感谢！

首先提出几个问题：


1.你自己编写过photoblog代码还是使用服务/网站/程序来为你做这个？


2.如果你没有编码，你觉得在你的档案的HTML中添加CSS感觉很舒服吗？


3.你想要将存档中的照片链接到显示原始照片的新页面，对吗？


如果你回答这些问题，我很确定我们可以为你做点什么...


我不会进入太多细节（直到你回答，就是这样），但是这就是我在想的事情...... 。


我们基本上可以为存档中的每张图片创建一个框。每个盒子将设置为固定的固定大小，如150 x 150像素。然后，我们将给定图片背景图像。一盒。这将使您有机会使用背景位置看到照片的任何150 x 150窗口。 CSS属性。另外，我们可以在页面上独立定位每个盒子 - 创建我们想要的任何图案。


我绝对可以帮助你 - 这听起来像一个很酷的项目。


如果你想单枪匹马，我会尝试这个代码（对于你创建的每个div框）：

展开 | 选择 | Wrap | 行号

Hi there,

I have a nice collection of photos on my photoblog, for which I created as well an archive, which shows the last 50 or so photos at the same time.

Now, I would like to have the photos displayed all in the same size (although they are originally in different sizes, some cropped, some landscape, some portrait).

Is it possible via the use of CSS to "squeeze" the photos in for example a quadratic shape without deforming the photo? Thus only some part of the photo is being displayed, the other kind of masked?

Thanks for any hints!

Stef

解决方案

I''m not sure what you mean by quadratic shape, but I think you can at least limit all of the photos to a consistent size by setting a fixed height and width for the image and then hiding the overflow. I know this works when using an image for a background...

This would be more of a "thumbnail" approach...

Can you post a little more description on what you are looking for?

I like the gallery, by the way...very clean look...

Tom

I''m not sure what you mean by quadratic shape, but I think you can at least limit all of the photos to a consistent size by setting a fixed height and width for the image and then hiding the overflow.

Thanks for the flowers! And yes, perhaps there are different approaches... The thing is that I would like to display the photos in the gallery say in 150x150px size. That would mean that only parts of the photos is being displayed, as the relative size of the photos is in many cases 3:2 and not 1:1.

This "hiding the overflow" is exactly what I thought how it should work. But I have no idea how...

Could you give me some hints?!

Thanks a lot!

A couple of questions first:

1. Did you code the photoblog yourself or did you use a service/site/program to do it for you?

2. If you didn''t code it, do you feel comfortable adding CSS to your archive''s HTML?

3. You want the photos in the archive to link to a new page with the original photo displayed, correct?

If you answer these, I''m pretty sure we can work something out for you...

I won''t go into too much detail (until you answer, that is), but here''s the sort of thing I''m thinking...

We can essentially make a box for each of the pictures in your archive. Each box will be set to a constant, fixed size like 150 x 150 px. We would then make a given picture the "background-image" of one box. This would afford you the opportunity to see any 150 x 150 window of the photo using the "background-position" CSS attribute. Additionally, we could position each box independently on the page - creating any pattern we would like.

I can definitely help you further- this sounds like a cool project.

If you want to go it alone, I would try this code (for each div box you create):

Expand|Select|Wrap|Line Numbers

这篇关于二次DIV没有二次照片？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！