手抄报 安全手抄报 手抄报内容 手抄报图片 英语手抄报 清明节手抄报 节约用水手抄报

Dreamweaver如何制作table细线表格边框CSS样式

时间:2024-10-11 18:26:34

1、首先打开DreamweaverCC创建一个表格,边框粗细为1像素,单元格边距和间距为零。

Dreamweaver如何制作table细线表格边框CSS样式

2、我们点实时视图看预览的表格边框比较粗

Dreamweaver如何制作table细线表格边框CSS样式

3、我们在IE浏览器和Chrome浏览器中预览也是粗线边框。那么怎么修改成细线表格哪。

Dreamweaver如何制作table细线表格边框CSS样式

4、在table标签里面添加一个style内嵌样式

Dreamweaver如何制作table细线表格边框CSS样式

5、在设计器窗口中选中table表格,在CSS设计器中选择内嵌样式table,点击属性边框项

Dreamweaver如何制作table细线表格边框CSS样式

6、把border-collapse属性值设置为collapse

Dreamweaver如何制作table细线表格边框CSS样式

7、把border-width属性值设置为thin

Dreamweaver如何制作table细线表格边框CSS样式

8、把border-style属性值设置为solid

Dreamweaver如何制作table细线表格边框CSS样式

9、勾选显示集,看我们为table标签CSS内嵌样式设置这3个属性

Dreamweaver如何制作table细线表格边框CSS样式

10、当然也可以手写代码

Dreamweaver如何制作table细线表格边框CSS样式

11、点击实时视图,看表格变成细线边框了

Dreamweaver如何制作table细线表格边框CSS样式

12、选择多种预览方式观察一下

Dreamweaver如何制作table细线表格边框CSS样式

13、看在IE浏览器和Chrome浏览器中均显示为细线边框

Dreamweaver如何制作table细线表格边框CSS样式
© 手抄报圈