DIV教程之视频：第1课 - 设置图片效果 - CSS/DIV结构专题解说

说实话，我并不是反对div+CSS，但物生一利，必生一弊，div+css的利处大家说了很多，我就说说狂热的追求div+css的几个弊端：

• 
  
• 
  

点击在线寓目
点击下载该视频教程　动力软件园分流下载　FLV播放器下载大概利用QQ影音播放
在五光十色的收集天下中，林林总总的图片构成了丰厚多彩的页面，可以让人更直不雅的感觉网页所要转达给用户的信息。本课先容CSS设置图片作风款式的办法，包含图片的边框、对齐体例、图文混排等，并经由过程实例综合笔墨、图片的各类使用。
1.图片款式
作为独自的图片自己，它的良多属性能够间接在HTML中举行调剂，可是经由过程CSS一致办理，不仅能够加倍准确的调剂图片的各类属性，还能够完成良多特别的效果。我们在这里次要解说CSS设置图片基础属性的办法，为进一步深切切磋打下基本。但愿人人可以把握以下两个方面的内容：

• 图片边框
  
• 图片缩放
  

2.图片的对齐

当图片与笔墨同时呈现在页面上的时分，图片的对齐体例就显得特别的主要。怎样可以公道的将图片对齐到幻想的地位，成为页面是不是全体和谐、一致的主要要素。我们在这里从图片程度对齐和竖直对齐两方面动身，分离先容CSS设置图片对齐体例的办法。但愿人人可以把握以下两个方面的内容：

• 横向对齐体例
  
• 纵向对齐体例
  

3.图文混排
Word中笔墨与图片有良多排版的体例，在网页中一样能够经由过程CSS设置完成各类图文混排的效果。我们在这里在上一课笔墨排版和上几节图片对齐等的基本上，先容CSS图文混排的详细办法。但愿人人可以把握以下两个方面的内容：

• 笔墨围绕
  
• 设置图片与笔墨间距
  

4.图文混排实例：八仙过海

登录/注册后可看大图

我们在这里经由过程详细实例，进一步牢固图文混排的办法，并使用到实践的网站制造中。该例以先容中国传统的八仙为题材，充实使用CSS图文混排的办法，完成页面的效果。本例最后的效果如图所示。
以下的内容是一位网友的DIVCSS编码笔记，是值得大家学习的，在实际工作与开发中，将工作中的点滴记录下来，回首这些过往，你也会收获很多

技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。

只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweavermxXX很难理解。

dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。

Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。

Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。

Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH，专业网页图像设计软件FIREWORKS，并称为“网页三剑客”。

Adobe Dreamweaver CS5 软件使设计人员和开发人员能充满自信地构建基于标准的网站。由于同新的 Adobe CS Live 在线服务 Adobe BrowserLab 集成。

在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。

可以使用 CSS 检查工具进行设计。