文章来源：寻修网

　　我对网页制作很感兴趣，想用网页的形式给学生出题，但是遇到两个问题向您求助，请帮助解答。一是不知道如何才能逼真地实现在横线上做填空题的效果；还有就是我想加入一些图片，用什么方法可以简单地实现图文混排？这两个操作能实现吗？

　　关于你的第一个问题，常规方法是用单行文本框来实现，但文本框的四条边框都是可见的，比较影响视觉效果，可以用下面的CSS样式代码隐藏掉文本框的三条边框，只保留最下面的一条边框线，就可以达到你需要的效果了。

　　网页中插入一个单行文本框的代码是“”（不包括引号），可以在当前的HTML文本框代码中加入样式代码“style="BORDER-RIGHT: 0pt dashed; BORDER-TOP: 0pt dashed; BORDER-LEFT: 0pt dashed; WIDTH: 100pt;  BORDER-BOTTOM: 2pt groove"”（不包括引号），其含义是将文本框的左、右和顶部的边框的粗细设为0 pt，将下边线的粗细设为2 pt，直线的长度为100pt。预览时就可以看到文本框已经变成了一条直线，这时候就可以直接在直线上打字了（如图1）。由于当前的直线本质上还是一个文本框，所以你在判分时，编程的对象和方法与文本框判分的实现是一致的。

http://s10/middle/9b9105f4gf697b9836829&690

图1 这时候就可以直接在直线上打字了

　　关于第二个问题，在网页中实现图文混排比在Word中实现要复杂许多，常规的方法是是用“表格”或“层”来实现，操作起来比较麻烦，要轻松实现图片与网页文字混排的效果，可以在网页中需要插入图片的位置所对应的html代码后，加入下面引号内的代码就可以实现：“”（将“图片路径”改为相应的图片文件路径），其中float属性是样式代码中的一个重要属性，它可用于定义对象浮动的方向。float:left可实现指定的图片左对齐；float:right 则可实现指定的图片右对齐（图文混排效果见图2）。

http://s11/middle/9b9105f4gbdbf909a57ba&690

图2 float:right 则可实现指定的图片右对齐

　　以上两个问题均在Dreamweaver MX中测试通过，如果你是用FrontPage制作网页的话，方法与Dreamweaver MX中的操作类似，可以自行尝试。