学习下CSS 扫瞄器的等宽空格
我在这里借用了新浪博客的盒子来说明下，大家可能发现了，其实边框border往往就只有1px的宽度，谁叫它是边框呢。[*]
[*]
良多时分，但愿可以在HTML中利用空格排版。但扫瞄器在剖析HTML时，会把一连的空格剖析成一个，以是我们会利用等如许的占位符。
可是也不是很牢靠，好比空格间距十分年夜，那末我们必需增添多个占位符，同时页面的体积会变得十分年夜。
同时，注重到Safari中的宽度是已设定字符的空格宽度（Safari的默许字体为Times），也就是说一其中笔墨符必要两个占位符。
详细情形以下图所示：
实在，这不是Safari的成绩，而是字体的成绩。办理的体例就是利用上面的属性
font-family:宋体;将Safari的默许字体设置成“宋体”等中英文等宽的字体，就可以办理。Windows版本的Safari字体设置，必要间接利用中文“宋体”如许的称号而不是“Simsun”（懂得缘故原由的兄弟请告知我）。
但至此，我们的基本方针没有办理，就是可否制止利用如许的占位符，而利用“原生”的空格。思索针对空缺的响应CSS属性，详细懂得有关white-space的用法，接上去就对照优点理了。
总结下利用white-space完成等宽空格的前提，有两个。必要设置对应的属性
white-space:pre;
然后设置等宽字符（包含等宽空格）便可。综合起来，就是如许
font-family:宋体,Simsun;
white-space:pre;
因为利用了中文CSS称号，以是在实践利用中必要思索款式的字符编码成绩。同时，必要分外思索的是，苹果机是不是有“宋体”（大概其他等宽的字体），有苹果机的兄弟请协助测试下。
--Split--
感激小马供应的别的一个思绪，就是利用em单元。1em复杂的说，就能够以为是一个字符宽度；同理，.5em就是半个字符。那末，下面的情形就能够利用如许写。
<span>买<insclass="half-word"></ins>宝<insclass="half-word"></ins>贝：</span><br/>
<span>我的淘宝：</span><br/>
<span>社<insclass="two-word"></ins>区：</span><br/>
对应的CSS应为
.half-word{width:.5em;}
.two-word{width:2em;}
经测试经由过程。
--Split--
针对这上述的两种分歧办法，团体以为应该依照实践情形思索接纳。好比第一种办法，固然依附详细的等宽字体，但没有增加其他分外的布局，关于今后的保护会加倍的便利；第二种办法，则更多的思索了实践的使用情形（同时也不必依附详细的等宽字体），可是也增加了分外的布局。
以是，如思索到今后的可保护性，同时“语义”的角度上剖析，推许第一种做法。而实践的使用情形下，同时必要使用对照庞大时，团体会选用第二种。
当然空口无凭，下面我们就让大家看一下Div+css在页面中达到的效果。 在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。 每天上网看着那样多的网页，于是我才下定决心选择了网页制作这一门课程，目的就是希望以后能够做出一个完美的网页来。 Dreamweaver在所见即所得添加链接，也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈，用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。 俗话说：兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中，我们难免会遇到各种各样的问题。 由CS4 版本开始，则转用WebKit 排版引擎（亦即Google Chrome和Apple Safari浏览器所用的排版引擎）作为网页预览。 是当我和赵丽芬崔明艳老师进行交流后，很快就了解了还不太清楚的内容和并不了解的知识（像布局表格、绘制布局单元格等）。 这个过程其实就是交流的过程。所有的这些都需要花时间。在面对完全陌生的软件时，就要多花时间对其产生初步的印象。此外，多操作也是非常重要的。 dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。
页:
[1]