http://zxh6655.cn/网站布局实录! - RainbowSoft Studio Z-Blog 1.8 Arwen Build 90619zh-CNCopyright www.zxh6655.cn. Some Rights Reserved.黑ICP备09093629号Mon, 06 Sep 2010 09:13:48 +0800zxh5566@tom.com (zxh5566)http://zxh6655.cn/post/107.htmlFri, 15 Jan 2010 19:00:42 +0800http://zxh6655.cn/post/107.html        在使用表格式布局的时期，设计师几乎只认识table标签，而在ⅪTML编码之中，就必要使用更多的标签来组织内容了。表格式布局之中，所有样式都由表格替代，无论是标题还是列表，都使用表格中的单元格组合来实现，这样做使得网页代码变得混乱，可读性差，也不利于修改；XTHML标记最终目的是给内容定义结构，浏览器通过解析标签把页面内容按结构展现出来。因此对于每个元素，都可以选择适合于这个元素的标签进行编码。天津网站制作公司，天津网站建设公司，天津网站建设。
...

]]>CSS格式化排版http://zxh6655.cn/post/107.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=107http://zxh6655.cn/cmd.asp?act=tb&id=107&key=d4adfe2ezxh5566@tom.com (zxh5566)http://zxh6655.cn/post/98.htmlWed, 30 Dec 2009 11:19:22 +0800http://zxh6655.cn/post/98.html在实际应用中，也可能需要一种很特殊的文字环绕方式希望文字能沿着图片中主体的—不规则边缘进行环绕，就像在矢量软件中做到的那样。但是div和img却都是以方块形式插入在页面中，而且浏览器也没有办法识别图片中的边缘（如下图），这时，就需要我们使用一些技巧性的手段来达到目的了。
如果我们希望能够有不规则的文字环绕效果，单独插入图片在段落中是不可行的，因为图片本身是方块状的矩型，无法改变其状态。因此只有将图片以背景形式放置在文本之中，背景乓与文本是二层关系，互相之间不会影响，而接下来就是本例中的核心内容—使用多个Div对象来创建接近不规则的形状，所要做的是插入一些div在段落。
...

]]>CSS格式化排版http://zxh6655.cn/post/98.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=98http://zxh6655.cn/cmd.asp?act=tb&id=98&key=28c9921ezxh5566@tom.com (zxh5566)http://zxh6655.cn/post/94.htmlSat, 26 Dec 2009 15:59:10 +0800http://zxh6655.cn/post/94.html    对于表单设计而言，除了XHTML及CSS能够帮助我们做到视觉设计及交互上的简单提升，更多表单可用性的设计有待于我们对用户的完整思考。在这里根据以往的经验就表单设计提出一些设计建议与方法，希望能有助于我们的网站设计。
    明确的输入域标识，作为表单上的每一个可输入区域，视觉设计上一定要合理方便用户使用，不能够一味追求美观而使可输入区域变得模糊不清，如果没有好想法，不妨使用默认样式，可是用户理解得最简单。而对于表单中必选和可选区域，无论是通过改变边框或背景颜色也好，增加记号标记也好，也一定要明确，使得访问者在使用表单的同时能够迅速理解表单元素规则。
...

]]>CSS格式化排版http://zxh6655.cn/post/94.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=94http://zxh6655.cn/cmd.asp?act=tb&id=94&key=f8ba16f8zxh5566@tom.com (zxh5566)http://zxh6655.cn/post/88.htmlSun, 20 Dec 2009 11:20:13 +0800http://zxh6655.cn/post/88.html    这里，我所说的“排版”并非Layout而是Typography，可以认为这指的是网页中文本处理的技巧。传统的印刷排版给我们留下了许多可以借鉴的技巧，然而到了Web这里，实际上能够应用的已经不多，而西方排版给我们留下的许多技巧，到了中文这里，实际上能够应用的也所剩无几——我猜这是令人高兴的，因为刚刚开始学习Web设计的朋友就不必费神记住那么多的条条框框。不过，就如往常一样，这篇文章的目的不仅为了解释我们该怎么做，更是为了解释这么做的原因为何排版是重要的？因为我们关心的不仅是布局——给页面划定好几个盒子和它们的位置—一还应该是那些盒子里装的是什么，而盒子里最重要的部分便是文本，在只有一台320X 200分辨率，16色的终端时，讨论行间距究竟应该是11像素还是12像素当然不现实，可是现在，计算机已经能够利用像素颜色的微妙变化来消除字体的锯齿，对单词的间距进行细小的调整使其更加自然，我们的显示器在改进，我们的操作系统在改进，我们的浏览器在进，CSS也在改进，在这种情况下，如果能够通过些许的调整使页面的内容更加美观，毫无疑问是值得的。天津网站建设，天津网站制作，天津做网站，天津网站优化
...

]]>CSS格式化排版http://zxh6655.cn/post/88.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=88http://zxh6655.cn/cmd.asp?act=tb&id=88&key=f2c9cdfezxh5566@tom.com (zxh5566)http://zxh6655.cn/post/85.htmlWed, 16 Dec 2009 11:25:20 +0800http://zxh6655.cn/post/85.html    在出版物应用中，一般比较重视图文排版的样式。对于出版物的排版，通常不允许通栏排版。网页设计继承了出版物排版的理念，却允许通栏排版，特别是对新闻、法律的以文字内容为主的对象。行网页通栏排版是，只要直接将段落文字放置于p或其他对象之中，再对段落文字应用间距、行距，字号等样式控制，便形成了排版拙形，文字与段落之中也有对这篷些文字样进行控制的方法，而在本节的文字排版之中，我们将结合CSS布局中的分栏技术，帮助文字进行分栏处理，使之能够像报纸一样实现分栏显示。
...

]]>CSS格式化排版http://zxh6655.cn/post/85.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=85http://zxh6655.cn/cmd.asp?act=tb&id=85&key=6f142595zxh5566@tom.com (zxh5566)http://zxh6655.cn/post/82.htmlSat, 12 Dec 2009 15:53:26 +0800http://zxh6655.cn/post/82.html        在排版软件中实现任意图文混排效果会很轻松的事情，但在网页设计中，所受的局限性是很大的。规则图文混排主要通过浮动来实现，而对于不规则的图文混排只能使用一蹩脚的背景图和众多复杂的布局元素编织而成。因为CSS的基本规则认定所有元素都以矩形块显示，而而浏览器也以这条基本规则解析和识别各种网页元素。
       背景图像具有强大的功能和用途，但也存在一些问题，如无法用CSS控制其大小，要梗图像像在页中显示恰当好处，使用前需要用图像编辑器先编辑好大小。如果我们希望实现不规则图文混排效果，直接在段落文本中插入图像是不行的，可以把图像作为背景先嵌入图文框元素中，CSS为了实现网页背景图像的广泛应用，提供了大量的属性，且得到了各大浏览器的倾力支持。综合利用这些属性可以提高网页排版与布局的灵活性和适应能力。然后分别每段文本的边界进行调节，来间接实现不规则排版效果。由于图像和文本处于不同的显示层，彼此互不影响，这样我们可以单独用CSS进行控制。可以定义p元素浮动显示，同时设置clear属性，避免段落之间同行显示，然后通过对每段宽度来实现环绕效果。实现不规则图文混排效果的关键：第一，先处理好背景图像，用图像编辑器把不需要显示区域用网页背景色进行填充。第二，应分别调整每段的边界和缩进实现文本的绕图像显示。要想实现更真实的环绕效果，可以为每行添加p元素，并分别进行设置，当然就比较麻烦。为了避免因浏览器窗口的变化而引起的段落文本错位，最好固定图文外框的大小。天津网站建设，天津网站优化，天津网站制作
...

]]>CSS格式化排版http://zxh6655.cn/post/82.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=82http://zxh6655.cn/cmd.asp?act=tb&id=82&key=45abf513zxh5566@tom.com (zxh5566)http://zxh6655.cn/post/80.htmlThu, 10 Dec 2009 20:36:09 +0800http://zxh6655.cn/post/80.html    图文混排是制作精美页面所必须面临的技术难点，通过将适当的图像与文字有效地排列组合在一起，可以大大丰富版面内容，在很大程度上提高版面的审美性。纵观富有说明力与艺术性的出版物，基萑本上都采用图文混排的页面编排方式。
在传统布局嘲用表格的强大功能实现各种图文混排效果，但在标准网页下，用CSS实现图文混排更具表现力
    图文混排的结构没有旨统一的标准，一般做法是把图像和文本信息同时封装在一个容器元素内，再根据图文混排结构的复杂程度分别嵌入其他布局元素或修饰元素。
...

]]>CSS格式化排版http://zxh6655.cn/post/80.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=80http://zxh6655.cn/cmd.asp?act=tb&id=80&key=0966c236zxh5566@tom.com (zxh5566)http://zxh6655.cn/post/79.htmlWed, 09 Dec 2009 22:01:05 +0800http://zxh6655.cn/post/79.html在CSS 2中有关段落文本行控制技术的属性包括下面几个，但现在主要在Ⅲ浏览器中可以使用，其他现代浏览器对于这些属性的支持不是很理想。
·word-wrap
定义当文本超出元素指定的宽度时是否换行，取值如下：normal:默认值，文本会张开元素的设置边界。
break-word：文本将在边界内换行，如果需要，单词会被分开换行(word-break)
使用该属性的局限性比较大，；提醒设计师注意以下几个问题：
(1)该属性仅作用于结构布局对象，如块状元素div。内联元素要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute，或者设定display属性为block。
...

]]>CSS格式化排版http://zxh6655.cn/post/79.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=79http://zxh6655.cn/cmd.asp?act=tb&id=79&key=fba315eczxh5566@tom.com (zxh5566)http://zxh6655.cn/post/78.htmlTue, 08 Dec 2009 20:48:32 +0800http://zxh6655.cn/post/78.html    不同民族和时代，使用文字的习惯也各不相同，其文本流动方式与方向也存在差异，如我国古代线装书中常用竖行文本来显示，即文本流从上向下流动，还有些文字习惯从右向左书写，惯相反。在CSS中通过一组特殊的属性可以实现这些文本流效果，但多数只能IE浏览器中获得支持。
  layout-flow，定义文本流动方式，该属性只能在IE浏览器中使用，其他浏览器不支持。取值如下：horizontal：默认值，文本流自左向右流入，下一行在前一行下面。这个值适用于拉丁语系。vertical-ideographic：文本流自上而下流入，下一行在前一行左面。这个值适用于亚洲语系。
...

]]>CSS格式化排版http://zxh6655.cn/post/78.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=78http://zxh6655.cn/cmd.asp?act=tb&id=78&key=37b646cfzxh5566@tom.com (zxh5566)http://zxh6655.cn/post/77.htmlMon, 07 Dec 2009 20:34:56 +0800http://zxh6655.cn/post/77.html    说到段落版式，我想到自己正用着的Word软件，这个大家再熟悉不过的文字处理工具，经过年的升级演化，在排版方面的功能已经非常成熟了。如果学习中结合Word的格式菜单，你就会发现学习的目标和兴趣就大多了。段落版式相对于字体样式就复杂多了，它需要噬设计师从更大的版面视角来编排文本格式问题，所以读者应静下心来，详细了解段落排版的各个要素。
    在Word中，缩进包括左缩进、右缩进、首行缩进和悬垂缩进。网页中多使用padding-left:和padding-right来实现左右缩进。悬垂缩进使用比较少，在CSS中没有直接的属性可以选用。不过使：用text-indent属性能够实现首行缩进和悬垂缩进。使用text-indent属性时，设计师应注意以下几个问题：天津网站建设，天津网站优化，汽车玻璃，商业策划招商，钢板桩租赁，天津废锡回收，天津网站制作text-indent属性适用于块状元素，如趴div、pre、hl ~-h6等，但不适用内联元素，如span、a、em等，；也不能适用替换元素，如img。ext-indent属性可以取负值，但应与边界或补白配合使用，避免凸出的文字被遮盖掉。text-indent属性值可以使用任何长度单位。使用百分比时，将以父元素的宽度为基础进行取值。text-indent属性只对第l行起作用，不受换行符<br>的影响。如果在第J行增掷<br>，将对空白行起作用。例如，如果我们在上面示例的第1段<p>后面增加一个<br/>，则首行缩进作用空白行，显示无任何效果。
...

]]>CSS格式化排版http://zxh6655.cn/post/77.html#commenthttp://zxh6655.cn/http://zxh6655.cn/feed.asp?cmt=77http://zxh6655.cn/cmd.asp?act=tb&id=77&key=7f4569e5