• 秒刷功能
  • 编辑器快捷键
  • 关注按钮
  • 添加背景图
  • 弹幕文字修改增删
  • 时间轴增加节点
  • DIY收藏,一键套用
  • 图片快传
  • 二维码
  • 搜狗号自媒体
  • 导入公众号
帮助中心首页 基础排版技巧 如何给文章内容或者段落添加背景图样式?

如何给文章内容或者段落添加背景图样式?

浏览量:1083

添加或替换背景图分为两种:

1. 全文背景图的添加或替换;

2. 单个样式背景图的添加或替换。


一、全文背景图设置


点击编辑菜单中的“插入背景图”,可设置整篇文章的背景图。



二、单个样式背景图设置


点击样式,选择“背景图”,仅设置当前样式的背景图。



三、背景图设置菜单


背景图设置菜单,左侧部分为选项设置,右侧部分为背景效果预览。


1. 设置纯色背景


背景类型选择纯色,可以在颜色设置中挑选合适的颜色,通过背景边距可设置文字到四周的距离。



2. 设置图片背景

背景图来源:

① 系统推荐的背景图;

② 本地上传电脑中保存的图片;

③ 使用我的图片中已上传的图片。



同时,背景图片可进行多种拉伸方式、背景位置和重复方式的设置,可选择推荐的设置或自行选择,以实现最好的展示效果。



以下图为例,对图片的拉伸、背景位置进行详细的介绍。



(演示图片)

拉伸方式:


拉伸方式即图片的缩放,有下面6种缩放方式:



①  自动:图片尺寸不会改变。原图片尺寸是多少,在背景图中就会显示多少,原图什么样,背景图就是什么样的.



 双向:图片在水平、垂直两个方向同时拉伸以铺满整个内容区域。背景图片可能会出现变形。


段落较少时 ▼



段落较多时 ▼



③  短边:背景图以内容区域竖直方向的高度为基准向右下角拉伸。此时,背景图的水平方向也会进行相应的缩放。


当背景图铺满水平位置之后,背景图将不能再进行拉伸。


注意:


如果内容区域段落过少-即竖直方向高度过低,可能会出现水平方向的背景图无法覆盖整个内容区域的情况。如下图所示:


1538297365(1).jpg


如果内容区域内容过多-即竖直方向的高度过高,会出现背景图无法覆盖整个内容区域的情况。如下图所示:



④  长边:背景图以水平方向的宽度(非文字宽度)为基准向下拉伸。当背景图在竖直方向上显示完整之后,背景图的尺寸会被放大。


注意:


如果内容区域段落过少-即竖直方向高度过低,竖直方向的背景图将无法完全展示出来。如下图所示:



如果内容区域内容过多-即竖直方向的高度过高,会出现水平方向的背景图片超出内容区域的情况,如下图所示:



水平:背景图以水平方向的宽度(非文字宽度)为基准向下拉伸。当背景图在竖直方向上显示完整之后,背景图将不能再进行拉伸。


注意:


如果内容区域段落过少-即竖直方向高度过低,竖直方向的背景图将无法完全展示出来。如下图所示:

如果内容区域内容过多-即竖直方向的高度过高,会出现背景图无法覆盖整个内容区域的情况。如下图所示:



 竖直:背景图以内容区域竖直方向的高度为基准向右下角拉伸。


当背景图在竖直方向上显示完整之后,背景图的尺寸会被放大。


注意:


如果内容区域段落过少-即竖直方向高度过低,水平方向的背景图可能无法铺满整个内容区。


如果内容区域内容过多-即竖直方向的高度过高,水平方向的背景图会超出内容区,使背景图显示不完整。



背景位置:

背景位置可以简单理解为图片在样式(或文章)中摆放的位置:



① 居中:背景图片居中放置。



② 左上:背景图片会基于内容区域的左上角显示



③ 右上:背景图片会基于内容区域的右上角显示



④ 自定义:设置自定义参数时,X 表示距离内容区域左侧多远;Y 表示距离内容区域上方多远


LYFOD6877[%MXML(7]$[~`4.png

(上方背景图设置参数为:X=50px ; Y=30px;)


我们以下图为例,讲解重复方式的选择:



重复方式:

当背景图片无法完整填充到样式(或文章)中时,选择不同的重复方式会有不同的显示效果。




① 平铺:当背景图尺寸小于内容区域时,背景图在水平方向和竖直方向都会重复显示。



② 不重复:背景图不会重复,按照原尺寸显示。



③ 水平重复:当背景图尺寸小于内容区域时,背景图会在水平方向重复显示。



④ 竖直当背景图尺寸小于内容区域时,背景图会在竖方向出现重复。





3. 取消显示背景图

背景类型选择“无”后点击“确定”,将移除样式的背景图。



四、会员特权


所有会员均可使用本地上传背景图片功能,不同等级会员享有的系统推荐背景图使用权限如下

V0免费会员:

V1银牌会员:

V2金牌会员:

V3钻石会员:



  • QQ在线客服

    请提供详细的截图大图+文字说明您的问题,您也可以通过帮助文档寻找答案!

    联系在线客服
  • 微信扫码查看帮助

    扫码关注,获取各种排版小技巧,黑科技!
  • 关于我们
  • 商务合作
  • 服务协议
  • 网站地图
  • 意见反馈

扫码查看帮助