我的CSS，你的意见 [英] My CSS, your opinion
本文介绍了我的CSS，你的意见的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
大家好！
我有三个问题，也许有人可以帮助我。
1.如果你有一两分钟......
我通常不会用CSS做很多事，但我决定在纯xhtml和css上运行我的网站
。现在我做到了，但我不知道，不管我是否b $ b"编码"一个好的css与否。如果有人有一些免费的分钟，可以
你可以在我的css上发表你的意见，你会在这里找到：
http://michaelsremarks.com/textpatte....php?s=default
（当然，每个人都会帮助我更好地制作这个css文件，
将在我的感谢去......中提及 - 文章！ ）
2.如果你偶然知道......
那里有网站/程序，可以帮助我让我的css
不仅看起来不错，还能控制错误吗？
3.也许......
那里有一个网站，它真的提供了有用的提示来创建和使用CSS吗？我确实阅读了很多自拍和&类似的网站，
，但他们的信息太笼统......
非常感谢，
Michael < br>
Hi everybody!
I have three questions, maybe somebody could help me with it.
1. "If you have a minute or two..."
I usually do not do a lot with CSS, but I decided to have my site run
on pure xhtml and css. Now I made it, but I do not know, whether I
"coded" a good css or not. If somebody has some minutes free, could
you please post your opinion on my css, which you will find here:
http://michaelsremarks.com/textpatte....php?s=default
(Of course, everybody who will help me to make this css-file better,
will be mentioned in my "Thanks go to..." - Article!)
2. "If you know that by chance..."
Is there a website/program out there, which can help me to make my css
not only look good, but also which controlls it on errors?
3. "Maybe..."
Is there a website out there, which really gives usefull tips for
creating and using css? I did read a lot of selfhtml & similar sites,
but their information is too general...
Thanks a lot,
Michael
推荐答案
Michael Kalina写道：
Michael Kalina wrote:
我通常不会用CSS做很多事，但我决定我的网站运行
纯xhtml和CSS。
好的，但为什么xhtml过渡？我没有看到任何暗示你的东西
无法移动到xhtml严格。嗯，就此而言，为什么xhtml呢？
html是一个更安全的赌注..
我不知道，我是否编码了一个好的css与否。
我可以在下面详细介绍一些可访问的问题。但
网站足够了。玻璃/咖啡杯图像我相当大。可能
想要修剪一下。而且我也会减少左/右边距。我是b $ b，而不是像这些边缘的背景图像，顺便说一句。 :)
你可以在我的CSS上发表您的意见
http://michaelsremarks.com/textpatte....php?s=default
字体：13px" Arial Narrow"，Arial，Helvetica， sans-serif;
不要指定字体大小（以像素为单位），因为IE / win用户无法调整大小
。并且不要为页面的主要部分设置字体大小。
这通常包括正文，表格，p，ul，ol等。保留字体大小
用户默认的文本，100％。
然后，您可以指定相对于用户的其他元素的字体
主体的默认值，例如标题。
h1 {font-size：200％} / *段落文字大小的两倍* /
h2 {font-size：150％} / *比段落文字大50％* /
/ *等* /
由于你的网站现在，字体太小，不适合我的口味。
字母间距：1px;
大多数宽度，边距等都以像素为单位指定。当我收缩我的
窗口时，这导致了相当严格的设计和水平滚动条的
。认为灵活。将左/右边距设置为3或4个em单位，并且
让内容占用剩余空间，而不指定任何
宽度。或者如果您愿意，可以设置最大宽度。但是要做得更灵活。
行高：1.8em;}
我不知道你为什么指定这个。最好将
line-height留给浏览器。我会抛弃这个。
那里有一个网站/程序，这可以帮助我让我的CSS不仅看起来不错，还能控制错误吗？
为了帮助防止错误，请确保。
http://jigsaw.w3.org/css-validator/
那里有一个网站，它真的提供了有用的提示来创建和使用CSS？我确实阅读了很多自拍和&类似的网站，
但他们的信息太笼统......
I usually do not do a lot with CSS, but I decided to have my site run
on pure xhtml and css.
Ok, but why xhtml transitional? I don''t see anything that suggests you
cannot move to xhtml strict. Well, for that matter, why xhtml at all?
html is a safer bet..
I do not know, whether I "coded" a good css or not.
There are accessibily problems that I talk more about below. But the
site is pretty enough. The glass/coffee cup images i rather large. Might
want to trim it a bit. And I''d reduce those left/right margins, too. I
rather like the background image in those margins, btw. :)
could you please post your opinion on my css
http://michaelsremarks.com/textpatte....php?s=default
font: 13px "Arial Narrow", Arial, Helvetica, sans-serif;
Don''t specify a font size in pixels, because IE/win users cannot resize
it. And don''t set a font-size at all for the main part of your pages.
This normally includes body, table, p, ul, ol, etc. Leave the font size
for the text at the users default, 100%.
You can then specify font for other elements relative to the user''s
default for the main body, e.g., for headings.
h1 {font-size: 200%} /* twice the size of paragraph text */
h2 {font-size: 150%} /* 50% larger than paragraph text */
/* etc. */
As your site is now, the font size is much too small for my tastes.
letter-spacing: 1px;
Most of your widths, margins, etc. are specified in pixels. This leads
to rather rigid designs and horizontal scroll bars when I shrink my
window. Think flexible. Set left/right margin to 3 or 4 em units, and
let the content take up the remaining space, without specifying any
width at all. Or set a max-width if you prefer. But do be more flexible.
line-height: 1.8em;}
I''m not sure why you specified this. It seems better to leave
line-height up to browser. I''d dump this.
Is there a website/program out there, which can help me to make my css
not only look good, but also which controlls it on errors?
To help prevent errors, sure.
http://jigsaw.w3.org/css-validator/
Is there a website out there, which really gives usefull tips for
creating and using css? I did read a lot of selfhtml & similar sites,
but their information is too general...
我不确定你尝试过哪些并且不喜欢。
http://www.alistapart.com/
按照他们的说法行事，而不是他们这样做。他们有时会有很好的CSS文章，但他们自己的网站却受到微字体和固定宽度设计的困扰。
http://css.maxdesign.com.au/listutorial/
更多字形，但它们很好关于名单的想法。
http://www.meyerweb.com/
再次使用微字体（我在这里看到一个模式）。但是有一些有用的信息。
http://www.meyerweb.com/eric/css/edge/
特别参见复杂的螺旋演示。
-
Brian（从我的地址中删除无效给我发电子邮件）
http://www.tsmchughs.com/
I''m not sure which ones you tried and didn''t like.
http://www.alistapart.com/
Do as they say, not as they do. They sometimes have good css articles,
but their own site is plagued by microfonts and fixed width design.
http://css.maxdesign.com.au/listutorial/
More microfonts, but they have good ideas about lists.
http://www.meyerweb.com/
Again with the microfonts (I''m seeing a pattern here). But there''s
useful info.
http://www.meyerweb.com/eric/css/edge/
See especially the complex spiral demo.
--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/
2004年5月9日16:11:20 -0700， Michael Kalina< mi *********** @ despammed.com>
写道：
On 9 May 2004 16:11:20 -0700, Michael Kalina <mi***********@despammed.com>
wrote:
1.如果你有一两分钟......
我通常不会用CSS做很多事，但我决定让我的网站在纯xhtml和css上运行
。
您是否使用XML工具来创建或维护页面？如果没有，那么
就我所见，使用XHTML真的没有任何好处。因为你没有
无法正确地向最流行的浏览器提供XHTML，那有什么意义呢？
你最好用HTML 4.01严格使用小写标签，引用
属性值和格式良好的元素。如果您将来需要将其更改为
XHTML，这将是快速而简单的。
现在我做到了，但我不知道，不管我
已编码一个好的css与否。如果有人有一些免费的分钟，你可以在我的css上发表你的意见，你会在这里找到：
http://michaelsremarks.com/textpatte....php?s=default
（当然，每个人都会帮我把这个css文件做得更好，
会在我的感谢去......中提及 - 文章！）
好的CSS从良好的HTML开始。
< body
style =" background-image：url（http://michaelsremarks.com/images /hintergrund.gif)">
CSS文档中没有这个属性的原因。在你的
样式表中设置它。如果某些页面需要不同的背景，请在
正文中使用ID。
< div id =" head"> Michael''s Remarks< ; / div>
这应该是一个h1。并且
< span class =" abschnitt"> Anmerkungen< / span>
应为h2。 （你不能把hx元素放在ap元素中，但是 -
所以你需要按顺序放置它们。如果你想把它们设计为
单位，在它们周围使用div元素。）对所有
标题使用标题标记。从逻辑上做 - 页面上的主标题是h1，然后h2
用于子部分，h3用于子部分。
< div id =" ;右边的>
这个专栏的目的是什么？使用ID名称提醒您内容是什么
。它会让你在路上更容易做出改变。您将看到
按选择器引用右列的样式。
< p>
< ; a href =" /"类= QUOT;喹">家庭和LT; / A> /
< a href =" /？rss = 1" title =" XML feed"> RSS< / a> /
< a href =" /？atom = 1" title =" XML feed"> Atom< / a>
< / p>
这不是段落！使用div标记。
整体而言，设计并不差。 Brian的评论也适合我。我只会给b $ b添加一个明智的方式来访问链接的风格与未访问的链接不同
链接，可能想要改变颜色或做些什么。
2.如果你偶然知道......
那里有没有网站/程序，这可以帮助我制作我的CSS
看起来不错，但也有哪些可以控制错误？
3.也许......
是否有一个网站，这真的提供了有用的提示
创建和使用CSS？我确实阅读了很多自拍和&类似网站，
但他们的信息太笼统......
非常感谢，
迈克尔
1. "If you have a minute or two..."
I usually do not do a lot with CSS, but I decided to have my site run
on pure xhtml and css.
Are you using XML tools to create or maintain the page? If no, then
there''s really no benefit for you to use XHTML as far as I can see. As you
cannot serve XHTML properly to the most popular browser, what''s the point?
You''re better off with HTML 4.01 Strict using lowercase tags, quoted
attribute values and well-formed elements. If you need to change it to
XHTML in the future it will be quick and easy to do so.
Now I made it, but I do not know, whether I
"coded" a good css or not. If somebody has some minutes free, could
you please post your opinion on my css, which you will find here:
http://michaelsremarks.com/textpatte....php?s=default
(Of course, everybody who will help me to make this css-file better,
will be mentioned in my "Thanks go to..." - Article!)
Good CSS starts with good HTML.
<body
style="background-image:url(http://michaelsremarks.com/images/hintergrund.gif)">
No reason for this attribute in a CSS document. Set this in your
stylesheet. If some pages require a different background, use an id on
body.
<div id="head">Michael''s Remarks</div>
This should be a h1. And
<span class="abschnitt">Anmerkungen</span>
should be a h2. (You cannot put a hx element within a p element, though -
so you''d need to put them in sequence. If you want to style them as a
unit, use a div element around them.) Use the heading markup for all
headings. Do it logically - the main heading on the page is h1, then h2
for subsections, h3 for subsections of those.
<div id="right">
What''s the purpose of this column? Use id names which remind you of what
the content is. It''ll make making changes down the road easier. You''ll see
by the style that the selector refers to the right column.
<p>
<a href="/" class="noline">Home</a> /
<a href="/?rss=1" title="XML feed">RSS</a> /
<a href="/?atom=1" title="XML feed">Atom</a>
</p>
This is not a paragraph! Use div markup for this.
Overall the design is not bad. Brian''s comments go for me too. I''ll only
add that it''s smart to style visited links differently than unvisited
links, might want to change color or do something.
2. "If you know that by chance..."
Is there a website/program out there, which can help me to make my css
not only look good, but also which controlls it on errors?
3. "Maybe..."
Is there a website out there, which really gives usefull tips for
creating and using css? I did read a lot of selfhtml & similar sites,
but their information is too general...
Thanks a lot,
Michael
在文章中Michael Kalina写道：
In article Michael Kalina wrote:
大家好！
我有三个问题，也许有人可以帮助我。
1.如果你有一两分钟......
我通常不会用CSS做很多事，但我决定让我的网站在纯xhtml上运行
CSS。现在我做到了，但我不知道，我是否已经编码了。一个好的css与否。如果有人有一些免费的分钟，你可以在我的css上发表你的意见，你会在这里找到：
http://michaelsremarks.com/textpatte....php?s=default
（当然，每个人都会帮我把这个css文件做得更好，
会在我的感谢去......中提及 - 文章！）
你似乎喜欢我只评论CSS。所以我没有看其他任何东西，
所以我的一些评论可能过于笼统。引用你的CSS
| a {text-decoration：none;}
不好，下划线是链接的最佳标志。
| blockquote {margin-left：20px; margin-right：0;}
Brian告诉px。使用0保证金和填充也是不好的，更多我们使用与字体大小相关的一些小值，比如0.1em。
|表{
|字体：13px" Arial Narrow"，Arial，Helvetica，sans-serif;
不要使用px。如果你有强大的桌子，使用90％的东西来支付
字体大小。不要使用通用的sans-serif，因为在Arial和helvetica之后，
其次最常用的是Verdana，你不想要它。
|字母间距：1px;
我们。如果用户使用30px字体，这看起来很难看。
| line-height：1.8em;
你试着水平节省空间，但不要垂直做它。
你确定你没有''我想在td上使用填充吗？
#center
|不是很好的身份证。我不知道它可能是什么。
| #center .bottomline
不好的班级名称。这是什么意思？最重要的，或者至少
重要，我想。
| {color：＃666;
|字体：10px" Arial Narrow"，Arial，Helvetica，sans-serif;
| }
至少，很明显。字体太小。有数百万人无法阅读它。你忘了用你的颜色定义背景。
| #center .bottomline a
| {border：none; color：＃666; text-decoration：none;
| }
非常糟糕。怎么会有人知道它是链接，如果它看起来像正常文本那么好吗？此外，访问和正常
链接没有区别，这是不好的。
| #center a {border-bottom：1px点缀＃222222;颜色：＃222;}
再次，为：link和：visited做差异。链接下的虚线边框
不是正常的说法是链接，更好地使用普通的unserline。
| #center h3 {
|字体：粗体14px Arial，Helvetica，sans-serif;
你真的应该使用相对字体大小。现在很容易得到所有
字体相同的大小，因为人们的浏览器使用最小的字体大小，如14px。
|字母间距：2px;
永远不要使用px设置字母间距
永远不要使用对齐，特别是不要在标题上使用它。
它会导致丑陋
| text-decoration：none;}
无用，但是如果有人使用重度用户风格，你可以覆盖它。
| #container {\ width：700px;
不要将任何宽度设置为700px。它太大太小了。
| background-color：#FFF;}
你错过了白色的颜色。为什么你使用白色背景
无论如何，它伤害了人们的眼睛。使用类似＃F8F8F8等的东西。
| #head {
| background：url（ http://michaelsremarks.com/images/mrlogo.jpg）不重复
|中心顶部;
也设置背景颜色。
|颜色：＃000;
设置颜色时始终设置背景颜色。背景图片不是
enaugh。
|保证金：0;
| padding-bottom：15px;
| padding-top：250px;
如果这是div，也可以左右使用填充。你确定这不是
h1？
|字体：普通18px palatino，georgia，verdana，arial，sans-serif;
| text-transform：大写;
| }
大写在serif字体上看起来很难看，恕我直言。除非字体样式有意义，否则不要使用通用的
arternatives。在这种情况下，显然不是这样的。
| #right {\width：180px; w \ width：180px; width：180px;}
为什么这3个时间定义？
| #right p {font：11px" Arial Narrow"，Arial，Helvetica，sans-serif;}
Arial Narrow不是好的段落字体。你是想在太小的空间里装得太多了吗？
2.如果你偶然知道......
有网站吗？ /程序在那里，这可以帮助我使我的CSS不仅看起来不错，而且还控制它的错误？
我不知道。通过W3C css checker运行它会给你一些
制服，但它对于涉及不同媒体的复杂事物并不好。
类型。如果你使用2个不同的选择器选择
相同的元素，没有程序可以发现，更不用说告诉它是否有所不同。
3.可能......
那里有一个网站，它真的提供了创建和使用CSS的有用提示吗？
很多。谷歌alt.html为有趣的giggly css的东西，你找到
brucies列表。
我读了很多selfhtml&类似的网站，
但是他们的信息太笼统......
Hi everybody!
I have three questions, maybe somebody could help me with it. 1. "If you have a minute or two..."
I usually do not do a lot with CSS, but I decided to have my site run
on pure xhtml and css. Now I made it, but I do not know, whether I
"coded" a good css or not. If somebody has some minutes free, could
you please post your opinion on my css, which you will find here:
http://michaelsremarks.com/textpatte....php?s=default
(Of course, everybody who will help me to make this css-file better,
will be mentioned in my "Thanks go to..." - Article!)
You seem to like me to comment only CSS. So I didn''t look anything else,
so some of my comments may be overgeneral. Quoting your CSS
| a { text-decoration: none;}
Not good, underlining is best indication of links.
| blockquote { margin-left: 20px;margin-right: 0;}
Brian told about px. It is also bad to use 0 margin and padding, much
better us some small value related to font size, like 0.1em.
| table {
| font: 13px "Arial Narrow", Arial, Helvetica, sans-serif;
Don''t use px. If you have mighty big table, use something like 90% for
font size. Don''t use generic sans-serif, since after Arial and helvetica,
next most used sans is Verdana, which you don''t want.
| letter-spacing: 1px;
Us em. If user uses 30px font, this will look ugly.
| line-height: 1.8em;
You try save space horizontally, but don''t bother doing it vertically.
Are you sure you don''t want to use padding on td?
#center
| Not very good id. I have no Idea what it might be.
| #center .bottomline
Not good classname. What does it mean? Most important, or least
important, I guess.
| { color: #666;
| font: 10px "Arial Narrow", Arial, Helvetica, sans-serif;
| }
Least, obviously. Too small font size. There is millions of people unable
to read it. You forgot to define background with your color.
| #center .bottomline a
| { border: none;color: #666;text-decoration: none;
| }
That is very bad. How will anybody know it is link, if it looks exactly
as normal text? Also, there is no difference between visited and normal
link, which is not good.
| #center a {border-bottom: 1px dotted #222222;color: #222;}
Again, make difference for :link and :visited. Dotted border under link
is not normal way to say something is link, better use normal unserline.
| #center h3 {
| font: bold 14px Arial, Helvetica, sans-serif;
You really should use relative font sizes. Now it is easy to get all
fonts same size, as peoples browsers use minimum font size like 14px.
| letter-spacing: 2px;
Never set letter-spacing using px
| text-align: justify;
Never use justify, especially don''t use it on heading.
It will cause ugliness
| text-decoration: none;}
Useless, but if someone uses heavy userstyle, you override it.
| #container {\width: 700px;
Do not set any width to 700px. It is too big and too small.
| background-color: #FFF;}
You missed color with you white. Why are you using white background
anyway, it hurts peoples eyes. Use something like #F8F8F8 etc.
| #head {
| background: url(http://michaelsremarks.com/images/mrlogo.jpg) no-repeat
| center top;
Set also background color.
| color: #000;
Always set background color, when setting color. Background image is not
enaugh.
| margin: 0;
| padding-bottom: 15px;
| padding-top: 250px;
If this is div, use padding-left and right too. Are you sure this is not
h1?
| font: normal 18px palatino, georgia, verdana, arial, sans-serif;
| text-transform: uppercase;
| }
Uppercase looks ugly on serif fonts, IMHO. Do not use generic
arternatives, unless style of font is meaningful. In this case, it is
clear that that is not the case.
| #right {\width: 180px;w\idth: 180px;width: 180px;}
Why this 3 time definition?
| #right p {font: 11px "Arial Narrow", Arial, Helvetica, sans-serif;}
Arial Narrow is not good paragraph font. Are you trying to fit too much
in little space?
2. "If you know that by chance..."
Is there a website/program out there, which can help me to make my css
not only look good, but also which controlls it on errors?
I don''t know. Running it trough W3C css checker gives you some kind of
uniform, but it is not good for complex things involving different media
types. And no program can spot if you use 2 different selectors to select
same element, let alone tell if it makes difference.
3. "Maybe..."
Is there a website out there, which really gives usefull tips for
creating and using css?
Plenty. Google alt.html for "fun ''n giggly css stuff", and you find
brucies list.
I did read a lot of selfhtml & similar sites,
but their information is too general...
Ther总是
http://www.w3.org/TR/CSS1
http://www.w3.org/TR/CSS21/
http://www.w3.org/TR/CSS2/
-
Lauri Raittila< http://www.iki.fi/lr> < http://www.iki.fi/zwak/fonts>
我在找工作Etsin ty？t？
Ther is always
http://www.w3.org/TR/CSS1
http://www.w3.org/TR/CSS21/
http://www.w3.org/TR/CSS2/
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
I''m looking for work | Etsin ty?t?
这篇关于我的CSS，你的意见的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
