Not entirely sure what you're asking, but if you're talking about how to slice the PSD, I wouldn't slice everything at set dimensions. Let the layout dictate where to slice, and try to slice it logically by section, in such a way that reassembling it with HTML/CSS is easy.
Start by mentally diving the layout into sections, e.g. top banner, left column, right column, content area, footer, etc. After sectioning the layout, just start slicing it logically into small or medium sized images.
It might help to create a skeleton in HTML/CSS so you have an idea of how you need to slice the template. This tends to work out well because you're not just slicing it randomly, but rather you're slicing it to fit the skeleton that you created. Obviously, you may need to slice a big image like a top banner into a few parts, but that doesn't really change anything - you're still fitting the sections of the template to the sections of your skeleton.
Here's something I put together really quickly, just to illustrate how to go about slicing the image. I wouldn't use my exact example, but it should point you in the right direction:
That's probably the best advice I can give with the provided information. I'll expand on my answer if you provide more details.
EDIT
Looking at the source on your page, it looks like you just need to float div#middle so the right sidebar doesn't drop below it.
CSS table layouts are really good for this kind of stuff. Give something like this a shot:
发布评论
评论(1)
不完全确定你在问什么,但如果你谈论的是如何切片 PSD,我不会以设定的尺寸切片所有内容。让布局决定切片的位置,并尝试按部分进行逻辑切片,这样就可以轻松地使用 HTML/CSS 重新组装它。
首先在心里将布局分成几个部分,例如顶部横幅、左栏、右栏、内容区域、页脚等。对布局进行分区后,只需开始将其逻辑切成小或中尺寸的图像即可。
它可能有助于在 HTML/CSS 中创建骨架,以便您了解需要如何对模板进行切片。这往往效果很好,因为您不仅仅是随机地切片它,而是将它切片以适合您创建的骨架。显然,您可能需要将像顶部横幅这样的大图像分割成几个部分,但这并没有真正改变任何东西 - 您仍然将模板的部分与骨架的部分相匹配。
以下是我非常快速整理的内容,只是为了说明如何对图像进行切片。我不会使用我的确切示例,但它应该为您指明正确的方向:
这可能是我可以根据所提供的信息给出的最佳建议。如果您提供更多详细信息,我将扩展我的答案。
编辑
查看页面上的源代码,看起来您只需要浮动
div#middle
,这样右侧边栏就不会落在它下面。CSS 表格布局非常适合此类内容。尝试一下这样的事情:
以下是一些讨论 CSS2 中基于表格的布局的文章:
Not entirely sure what you're asking, but if you're talking about how to slice the PSD, I wouldn't slice everything at set dimensions. Let the layout dictate where to slice, and try to slice it logically by section, in such a way that reassembling it with HTML/CSS is easy.
Start by mentally diving the layout into sections, e.g. top banner, left column, right column, content area, footer, etc. After sectioning the layout, just start slicing it logically into small or medium sized images.
It might help to create a skeleton in HTML/CSS so you have an idea of how you need to slice the template. This tends to work out well because you're not just slicing it randomly, but rather you're slicing it to fit the skeleton that you created. Obviously, you may need to slice a big image like a top banner into a few parts, but that doesn't really change anything - you're still fitting the sections of the template to the sections of your skeleton.
Here's something I put together really quickly, just to illustrate how to go about slicing the image. I wouldn't use my exact example, but it should point you in the right direction:
That's probably the best advice I can give with the provided information. I'll expand on my answer if you provide more details.
EDIT
Looking at the source on your page, it looks like you just need to float
div#middle
so the right sidebar doesn't drop below it.CSS table layouts are really good for this kind of stuff. Give something like this a shot:
Here are some articles discussing table-based layouts in CSS2: