Dreamweaver里做文章排版

 时间:2024-09-21 21:54:27

网页排版是编辑们必备的技能,也是用户能直接感官的部分,好的排版能吸引客户,增加浏览量。怎么做呢?这里介绍最简单的文章内页排版。

Dreamweaver里做文章排版

工具/原料

Dreamweaver

素材

方法/步骤

1、新建HTML文档,设置body宽度为950px;插入一个div输入文章标题,H居中(定义居中样式cen)。

Dreamweaver里做文章排版

2、为了区分标题和内容,我们在标题下面插入一条分隔线。操作为:插入--图像对象--图像占位符,在属性框中填写长950px、高1px。

Dreamweaver里做文章排版

3、换行,放入文章内容。预览效果如下,我们需要进一步修饰文字效果。

Dreamweaver里做文章排版

4、首先,首行缩进水貔藻疽,在内容的每个段落p里设置text-indenet属性,指缩进元素的首行文本,单位为em,意思是页面字体的几倍,这里我们设置为2em。

Dreamweaver里做文章排版

5、再把文章中的提示文字标为H3,预览情况如下。

Dreamweaver里做文章排版

6、下面准备插入图片,第一个兔脒巛钒图片我们放在文字最上面,让它居中。直接在属性面板里点击居中图标,图片是不会居中的。我们可以套用之前设置标题时设置的样式"cen",图片就能居中了。

Dreamweaver里做文章排版

7、同样的方法我们在下面也插入2张图片。

Dreamweaver里做文章排版

其他Get√

1、如何让div居中?在div的style里设置margin-left和margin-right属性为auto,div就水平居中了。

Dreamweaver里做文章排版

2、插入图片时弹出框显示的替换文字可写可不老揉孟阼写,但写了对网站优化有好处。因为百度蜘蛛不认识图片(只认文字),写了替换文字,就可以让蜘蛛爬取到信息。

Dreamweaver里做文章排版

3、给图片套用样式时,光标要放在图片前面噢!

Dreamweaver里做文章排版

如何在dreamweaver中改变网页文字的颜色 Dreamweaver学习:[13]网页设置链接样式 如何在DW中设置电子邮件链接 Dreamweaver CS3中的表单对象各选项的含义 Dreamweaver做的超链接在新窗口打开的操作
热门搜索
帅男图片 释迦摩尼佛图片 如何剪切图片 丰田越野车报价及图片 闺蜜的图片