依葫蘆畫瓢,按照《巧妙》一文的所述的方法二,筆者在Dreamweaver中插入表格,配置單元格邊距和間距均為0,表格的寬度為1個像素,并配置背景色為藍色。確認配置無誤后,按F12預覽,可是網頁上并沒有如愿出現豎直細線條(如圖1)。明明進行了正確的配置卻不能實現豎直細線條,真是郁悶!

圖1
這是什么原因呢?于是筆者打開Dreamweaver的源代碼窗口,經過仔細觀察,發現配置為1像素寬的單元格中有個“ ”的標記(如圖2),這個標記是HTML中的轉義符,在瀏覽器輸出為一個空格。發現這個標記,筆者終于恍然大悟,原來就是這個標記在作祟!于是刪除這個標記后,再次打開網頁,豎直細線條終于成功的配置了!

圖2
在Dreamweaver中插入表格都會自動在每個單元格中加上“ ”的標記,正是因為這個標記,使得配置為1像素寬的單元格在瀏覽器中顯示時多了個空格,把單元格撐大。
另外,《巧妙》一文的方法一使用<hr>語句來插入豎直線,筆者覺得有不妥之處,因為<hr>語句插入的豎直線上下都會留有空白,并不能在任何時候都滿足自己的需要,所以筆者建議盡量使用插入表格的方法來實現。