Dreamweaver图文排版-文字在左图片居右设置

 时间:2024-10-13 01:17:11

1、可以先打个草稿,左侧为文字区,右侧为图片区,图片区可以作为一个整体,这样可以看做一个大框里面包含两个盒子,左侧为文字盒子右侧为图片盒子,而图片盒子里面又含有三张图片,分析完成后,就可以利用浮动来解决问题。

Dreamweaver图文排版-文字在左图片居右设置

2、打开DW,选择新建HTML文件

Dreamweaver图文排版-文字在左图片居右设置

3、首先先建立三个盒子,大盒子包含两个小盒子,如图

Dreamweaver图文排版-文字在左图片居右设置

4、然后再对细节进行完善,左侧为文字区,直接在所建立的div中添加文字即可,当然也可以添加一些文字标签,右侧添加的无序列表,方便图片的插入排序

Dreamweaver图文排版-文字在左图片居右设置

5、内容区添加完成后,在css样式中添加详细修饰,如图所示

Dreamweaver图文排版-文字在左图片居右设置

6、最后在浏览器预览效果如图所示

Dreamweaver图文排版-文字在左图片居右设置
  • 在Dreamweaver HTML文档中如何新建CSS样式?
  • dw图片滚动效果怎么做
  • dw字体大小设置
  • 在Dreamweaver文档中如何插入记录集导航条?
  • DW如何把文字居中
  • 热门搜索
    手抄报安全伴我行 学科学爱科学手抄报 小学三年级手抄报大全 只要妈妈露笑脸手抄报 关于春节手抄报的内容 小学生法制手抄报资料 我爱爸爸妈妈手抄报 关于曹文轩的手抄报 安全手抄报花边 食品药品安全手抄报