科技在进步,网站制作技术也在不断的改革创新,不同阶段的网站设计师在进行网站设计时所采用的方法技巧也必然会有一定的差异,但赣州网站建设认为大家都应该要时刻注意以下几个问题 网站设计注意事项一:掌握 css 字体简写规则 一些设计师朋友在使用css定义字体时极有可能会采用以下写法: font-size: 1em; line-height: 1.5em; font-weight: bold; font-style: italic; font-variant: small-caps; font-family: verdana,serif;
如此一来简单的事情就变得复杂了很多,赣州网站建设建议大家可以这样做:
font: 1em/1.5em bold italic small-caps verdana,serif;
不过赣州网站建设建议在使用这一方法时一定要注意指定 font-size 和 font-family 属性。 网站设计注意事项二:在使用两个 class 时会出现什么情况 赣州网站建设发现通常情况下大家一般都只会为属性定义一个 class ,但这并不是绝对的,如果我们同时使用了两个 class ,并且两者中有任何规则重叠,那么后一个将获得实际的优先应用。 网站设计注意事项三:不必特意指定 css 中边框的一些默认值 据赣州网站建设观察到的结果显示,很多朋友在为一条边框编写规则时,会习惯性的为其指定颜色、宽度以及样式。例如一条3像素宽的黑色实线边框大家可能会写成:
border: 3px solid #000()
其实我们只需要指定样式值即可,其他的数值均为默认数据。 网站设计注意事项四:语句 !important 通常会被IE忽略 赣州网站建设相信大家都知道 CSS 的优先顺序是从右到左的,但对于浏览器而言带 !important 的语句将享有绝对优先权。 网站设计注意事项五:图片替换技巧 我们都知道如果通过标准的 html 来显示文字除了加快下载速度之外还可以获得更好的可用性,但当我们在网站设计的过程中必须要使用到访问者机器中可能没有的字体样式时只能用图片来替换。 赣州网站建设认为可以这样做: h1 { background: url(widget-image.gif) no-repeat; } h1 span { position: absolute; left:-2000px; } 网站设计注意事项六:更简单实用的css盒模型hack IE6浏览器以下的IE版本通常会把某元素的边框值和填充值包含在宽度之内,这样一来就会对网页的正常显示造成影响,这时大家通常会选用 css 盒模型 hack 来解决这一问题。 赣州网站建设建议大家可以这样做: css: #box { width: 150px; } #box div { border: 5px; padding: 20px; } html: ... 更简单更实用。 网站设计注意事项七:将块元素居中 想将固定宽度的布局放置于屏幕中央可以参照以下写法: body { text-align: center; } #content { text-align: left; width: 700px; margin: 0 auto; }
记住在 #content 的 div 中指定 text-align: left 否则赣州网站建设担心这不是我们想要的结果。 网站设计注意事项八:如何在css中实现垂直居中 如果想实现盒高2e垂直居中,只需加入 mline-height: 2em 即可实现。 网站设计注意事项九:如何进行容器内的 css 定位 赣州网站建设建议写法:
#container { position: relative; }
网站设计注意事项十:如何避免延伸至屏幕底部的背景色 赣州网站建设解决方案: body { background: url(blue-image.gif) 0 0 repeat-y; }
|