如何处理CSS设计 [英] How to approach css design

查看:51
本文介绍了如何处理CSS设计的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在Macromedia Dreamweaver新闻组发布了这个,但是没有回复。


我一直在努力学习CSS。下面是我使用绝对位置设法做的几个设计的链接



http://63.134.232.79/untitled-1.htm

http://63.134.232.79/blog4/default.htm


现在,如何在不使用

绝对位置的情况下构建一个新的基于css的网站,并允许该区域(灰色边框)

扩展内容?


我已经阅读了几本书。所有这些都非常适合2柱和3柱

设计,但是如果我想做这样的设计怎么办?


我猜我在看什么for是一个教程或帮助,它将引导你

通过在Photoshop中创建设计后的操作。


例如,

1.对于固定的中心设计,创建一个包装器。

2.为每个元素创建一个div,即标题,左侧内容,

正确的内容,页脚等等

3.?


charlie

解决方案

< blockquote> charlie写道:


我一直在努力学习CSS。下面是我使用绝对位置设法做的几个设计的链接。

http://63.134.232.79/untitled-1.htm

这是一个基本的两列布局。有什么问题?


您将WWW视为打印介质。这是一个严重的错误。

关于你在网页上控制的唯一内容是内容。

你无法控制:

- font

- 字体大小

- 颜色

- 屏幕分辨率

- 视口大小

你可以用CSS推荐一些这些东西。但是游客有最终的控制权。

正如你所注意到的,使用position:absolute就是一切都是坏的计划。特别是因为你已经创建了这样一个严格的
结构。任何更改(尝试更改浏览器的字体大小)和

布局开始看起来马虎。
现在,如何在不使用
绝对位置和允许区域(灰色边框)随内容扩展?

不要使用图像背景作为边框。本质上不灵活。使用

CSS" border"物业。

不要指定高度。属性。这会自动冻结布局。

我已经阅读了几本书。所有这些对于2柱和3柱设计来说都很棒,但如果我想做这样的设计怎么办?

这是一个可以开始的地方:< http:// www。 w3.org/2002/03/tutorials>

我想我正在寻找的是一个教程或帮助,它将引导您完成创建设计之后的操作Photoshop。



Photoshop是一个用于创建网页的糟糕工具。用于操作图像




-

jmm(连字符)列表(at)sohnen-moe(点) com

(删除.AXSPAMGN电子邮件)


charlie写道:

我在Macromedia Dreamweaver新闻组发布了这个但是没有回复。

是的,并不太令人惊讶。

可以使用Dreamweaver编写支持CSS的干净HTML。

但它是从我听到的内容过渡不容易。

我一直在努力学习CSS。下面是我使用绝对位置设法做的几个设计的链接。



对所有新文档使用HTML 4.01严格。 Transitional是指将遗留页面转换为HTML v4的中间步骤。


-

jmm(连字符)列表(上)sohnen-moe(点)com

(删除.AXSPAMGN电子邮件)


感谢您的回复,我想。就像我说的那样,我已经阅读了CSS上的几本书

,当然还有html,我知道

print和web之间的区别。我可以做布局表。我在w3.org上阅读了

教程。该教程让我想起了这些书,除了我

没有必要为w3.org教程付费。


我不用Photoshop用于创建网页。我使用Photoshop来创建设计的
。我本可以轻松地用一张纸。所以

问题仍然是如何使用CSS接近布局。


谢谢,

查理



2006-01-21 16:59:27 -0500,Jim Moe< jm *************** @ sohnen-moe.com> ;说:

charlie写道:


我一直在努力学习CSS。下面是我使用绝对位置设法做的几个设计的链接。

http://63.134.232.79/untitled-1.htm


这是一个基本的双列布局。有什么问题?

您正在将WWW视为打印介质。这是一个严重的错误。
你在网页上唯一控制的就是内容。
你无法控制:
- font
- 字体大小
- 颜色
- 屏幕分辨率
- 视口大小
你可以用CSS推荐一些这些东西。但访客有最终的控制权。
正如你所注意到的,使用职位:绝对的一切都是一个糟糕的计划。特别是因为你已经创造了如此严格的结构。任何改变(尝试改变你的浏览器的字体大小)和你的
布局开始看起来马虎。


现在,我如何建立一个新的基于CSS的网站没有使用
绝对位置并允许区域(灰色边框)与内容一起展开?


不要使用图像背景作为边框。本质上不灵活。使用CSS" border"属性。
不要指定高度。属性。这会自动冻结布局。

我已经阅读了几本书。所有这些看起来都很适合2柱和3柱设计,但是如果我想做这样的设计怎么办?


这里有个起点:< http:// www。 w3.org/2002/03/tutorials>

我想我正在寻找的是一个教程或帮助,它将引导你
在你之后做什么在Photoshop中创建一个设计。


Photoshop是一个创建网页的糟糕工具。它用于操作图像。



I posted this at Macromedia Dreamweaver newsgroup but go no response.

I''ve been trying to learn CSS. Below is a link to a couple of designs
that I managed to do using absolute position.

http://63.134.232.79/untitled-1.htm

http://63.134.232.79/blog4/default.htm

Now, how do I go about building a new css based site without using
absolute positions and allowing for the area (grey bordered box) to
expand with the content?

I ''ve read serveral books. All of them seem great for 2 and 3 column
design but what if I want to do designs like this?

I guess what I''m looking for is a tutorial or help that will walk you
through what to do after you create a design in Photoshop.

For example,
1. For a fixed center design create a wrapper.
2. Create a div for each of your elements ie, header, left content,
right content, footer,etc
3. ?

charlie

解决方案

charlie wrote:


I''ve been trying to learn CSS. Below is a link to a couple of designs
that I managed to do using absolute position.

http://63.134.232.79/untitled-1.htm
This is a basic two-column layout. What''s the problem?

You are treating the WWW like a print medium. This is a grave mistake.
About the only thing you control on a web page is content.
You cannot control:
- font
- font size
- color
- screen resolution
- viewport size
You can suggest some of these things with CSS. But the visitor has
ultimate control.
As you have noticed, using position:absolute for everything is a
generally bad plan. Especially since you have created such a rigid
structure. Any change (try changing your browser''s font size) and your
layout starts looking sloppy.
Now, how do I go about building a new css based site without using
absolute positions and allowing for the area (grey bordered box) to
expand with the content?
Do not use an image background for borders. Inherently inflexible. Use
the CSS "border" property.
Do not specify the "height" property. That automatically freezes the layout.
I ''ve read serveral books. All of them seem great for 2 and 3 column
design but what if I want to do designs like this?
Here''s a place to start: <http://www.w3.org/2002/03/tutorials>
I guess what I''m looking for is a tutorial or help that will walk you
through what to do after you create a design in Photoshop.


Photoshop is a terrible tool for creating web pages. It is for
manipulating images.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)


charlie wrote:

I posted this at Macromedia Dreamweaver newsgroup but go no response.
Yeah, not too surprising.
It is possible to write clean HTML with supporting CSS with Dreamweaver.
But it is not an easy transition from what I hear.
I''ve been trying to learn CSS. Below is a link to a couple of designs
that I managed to do using absolute position.


Use HTML 4.01 Strict for all new documents. Transitional is meant as an
intermediate step for converting legacy pages to HTML v4.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)


Thanks for the reply, I think. Like I said, I''ve read serveral books
on CSS and certainly from doing html I know the difference between
print and the web. I could do the layout tables. I have read the
tutorials at w3.org. The tutorial remind me of the books, except I
didn''t have to pay for the w3.org tutorials.

I don''t use Photoshop for creating web page. I use Photoshop for
creating the design. I could have easily used a piece of paper. So
the question is still how to approach the layout using CSS.

Thanks,
Charlie


On 2006-01-21 16:59:27 -0500, Jim Moe <jm***************@sohnen-moe.com> said:

charlie wrote:


I''ve been trying to learn CSS. Below is a link to a couple of designs
that I managed to do using absolute position.

http://63.134.232.79/untitled-1.htm


This is a basic two-column layout. What''s the problem?

You are treating the WWW like a print medium. This is a grave mistake.
About the only thing you control on a web page is content.
You cannot control:
- font
- font size
- color
- screen resolution
- viewport size
You can suggest some of these things with CSS. But the visitor has
ultimate control.
As you have noticed, using position:absolute for everything is a
generally bad plan. Especially since you have created such a rigid
structure. Any change (try changing your browser''s font size) and your
layout starts looking sloppy.


Now, how do I go about building a new css based site without using
absolute positions and allowing for the area (grey bordered box) to
expand with the content?


Do not use an image background for borders. Inherently inflexible. Use
the CSS "border" property.
Do not specify the "height" property. That automatically freezes the layout.

I ''ve read serveral books. All of them seem great for 2 and 3 column
design but what if I want to do designs like this?


Here''s a place to start: <http://www.w3.org/2002/03/tutorials>

I guess what I''m looking for is a tutorial or help that will walk you
through what to do after you create a design in Photoshop.


Photoshop is a terrible tool for creating web pages. It is for
manipulating images.



这篇关于如何处理CSS设计的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆