Dreamweaver如何设置文章排版

网页排版是编辑们必备的技能,也是用户能直接感觉到的部分,好的排版能吸引客户,增加浏览量。怎么做呢?下面就给大家说说最简单的文章内页排版。

操作方法

  • 01

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

  • 02

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

  • 03

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

  • 04

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

  • 05

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

  • 06

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

  • 07

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

(0)

相关推荐

  • 百度空间如何设置文章置顶

    百度空间设置文章置顶方法: 第一步:添加自定义模块。 登录后在设置——高级设置——内容模块,选择添加自定义模块,确定后,点击“保存修改”。 第二步:修改自定义模块名称,并添加想要置顶的文章。 添加自定 ...

  • 知乎App怎么设置文章字体大小

    知乎是现在非常流行的一款问答软件,有些用户想知道怎么设置文章字体大小,接下来小编就给大家介绍一下具体的操作步骤.具体如下:1. 首先第一步打开手机中的[知乎]App,根据下图所示,选择合适的登录方式. ...

  • 怎么将word文档中的图片批量设置居中排版

    今天给大家介绍一下怎么将word文档中的图片批量设置居中排版的具体操作步骤.1. 首先打开电脑上想要编辑的Word文档,如图,插入的图片默认是靠左显示的.2. 若图片插入的比较多,一个一个进行选中,调 ...

  • Dreamweaver怎样设置URL的绝对路径和相对路径

    DW是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页,很多人不知道Dreamweaver怎样设置URL的绝对路径和相对路径 ...

  • 怎么样在word里把文章排版成1.5倍行距

    在word里把文章排版成1.5倍行距 操作方法 01 选择文章整个部分 02 右键-段落-行距-1.5倍-确定

  • 如何使用秀米进行微信公众号文章排版?

    刚刚接触微信公众号的小伙伴,可能对公众号推送文章的排版缺少,接下来小编就介绍一下使用秀米进行文章排版的方法. 操作方法 01 首先打开秀米的网页,即可看到各式各样的功能组件:小贴纸.关注和原文.分割线 ...

  • Dreamweaver如何设置文字环绕图片

    Dreamweaver是一套网页开发工具,今天我来和大家分享一下Dreamweaver如何设置文字环绕图片 操作方法 01 对于一个空白文档,依次点击"插入"--"Ima ...

  • 【微信排版工具】怎么让微信公众号文章排版好看

    看到别人的微信公众号文章排版,看着很舒适,还很好看,是不是很羡慕,下面给大家介绍几款排版神器: 操作方法 01 微信公众号的排版是一个技术活,不仅需要审美,还有自己的风格,对于刚入手微信公众号工作的小 ...

  • Dreamweaver怎样设置测试的浏览器

    网页设计工程师在写网页的时候一定要注意一件事情,就是测试浏览器的兼容性,写一行得测试一行,今天我今天就教大家怎样Dreamweaver怎样设置测试的浏览器,让大家用起来的时候更顺手 操作方法 01 这 ...