HTML中如何给图片添加边框代码

在HTML5中,如果给图片添加描边的效果,该怎么用代码做到呢

操作方法

  • 01

    如图,在代码工具中,先建好几个图片,如图这里的img图片被div盒子包含;然后将盒子设置宽度,然后浮动;图片填充整个盒子大小

  • 02

    效果就是这样的,如图

  • 03

    添加图片的描边效果有两种方法,对图片添加描边或者是给外面的盒子套个描边,先看给图片添加描边,如图;就是直接在img图片标签里添加上描边border

  • 04

    如图,添加了描边后的图片效果

  • 05

    想要改变图片的描边大小以及颜色,在这里修改

  • 06

    然后如果是在div盒子添加描边效果时,和跟在img上添加方法一样,也是border属性

  • 07

    两种方法都能够成功,看你习惯使用哪种方法了。

(0)

相关推荐

  • excel表格中怎么给图片添加边框?

    excel表格中插入了图片,想要给图片添加变宽,该怎么添加呢?下面我们就来看看详细的教程. 1.打开一个含有图片的工作簿,如下图所示,用鼠标左键双击图片 2.进入“图片工具”(图中红框),用鼠标左键单 ...

  • word为图片添加边框方法介绍

    我们在对文档进行编辑的时候经常会添加图片,是文章更加生动但是如果不对图片进行好好排版,就会使文章变得杂乱无章.为图片添加边框就是整理图片的方法之一,下面小编就向大家简单介绍一下在word中怎么为图片添 ...

  • word怎么为图片添加边框

    我们在对文档进行编辑的时候经常会添加图片,是文章更加生动但是如果不对图片进行好好排版,就会使文章变得杂乱无章.为图片添加边框就是整理图片的方法之一,下面小编就向大家简单介绍一下在word中怎么为图片添 ...

  • 如何在Word中为图片添加边框效果(图文)

    如何在Word中为图片添加边框效果: (1)选中要添加边框的图片,单击“格式→边框和底纹”命令,打开“边框和底纹”对话框。在“边框”选项卡下选择边框样式、线型及颜色等,如图3-22所示。 (2)设置完 ...

  • 如何给Word文档中的图片添加边框的入门动画教程

    要给Word文档中的图片添加边框,可按以下步骤进行: 1.选中需要添加边框的图片. 2.使用"绘图"工具栏或"图片"工具栏上的"线型"按钮. ...

  • 如何在Word中为图片添加边框效果

    如何在Word中为图片添加边框效果: (1)选中要添加边框的图片,单击“格式→边框和底纹”命令,打开“边框和底纹”对话框。在“边框”选项卡下选择边框样式、线型及颜色等,如图3-22所示。 (2)设置完 ...

  • 如何在电脑的画图工具中为图片添加边框?

    相信很多小伙伴都有在使用电脑上的画图工具,在其中如何才能为图片添加边框呢?方法很简单,下面小编就来为大家介绍.具体如下:1. 首先,将我们需要添加边框的图片选中后右键,在弹出菜单中依次点击" ...

  • 美图秀秀中如何给图片添加文字边框

    有的小伙伴在使用美图秀秀软件时,喜欢给图片添加边框,那么如何添加文字边框呢?小编就来为大家介绍一下吧.具体如下:1. 第一步,双击或者右击打开美图秀秀软件.2. 第二步,来到美图秀秀软件主页面后,点击 ...

  • 如何给PPT中插入的图片添加样式和边框

    我们在PPT中插入图片后,想要给图片设置添加好看的样式和边框,该怎么操作呢?今天就跟大家介绍一下如何给PPT中插入的图片添加样式和边框的具体操作步骤.1. 首先打开电脑,找到桌面上的ppt软件,双击打 ...