html图片怎么添加

html图片怎么添加,第1张

html图片添加的方法如下:

工具:Dell游匣G15、Windows10、记事本2021。

1、首先在电脑中新建一个文件夹(如:web-01),在该文件夹里新建一个html文件(如:index1.html)。

2、接着打开这个html文件,编写一个html的基本框架。

3、接着在头部<head>……</head>中加入插入背景图片的代码。不设置平铺方式的情况下是默认水平竖直都平铺。

4、若要不重复平铺,需要写入“background-repeat:no-repeat”此时,图片只显示一次。

5、编写完成之后,保存为html后缀,如下图所示就完成了。

html添加图片的方法如下:

1、打开html软件。

2、导入项目。

3、找到要添加图片的位置。

4、写【imgsrc=“图片路径”】即可。

超文本标记语言(HyperTextMarkupLanguage),缩写为HTML,标准通用标记语言下的一个应用。HTML不是一种编程语言,而是一种标记语言(markuplanguage),是网页制作所必备的工具。“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。

超文本标记语言(或超文本标签语言)的结构包括“头”部分和“主体”部分,其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。

SVG

Scalable

Vector

Graphics,是一种用来绘制矢量图的

HTML5

标签。你只需定义好XML属性,就能获得一致的图像元素。

使用SVG之前先将标签加入到HTML

body中。就像其他的HTML标签一样,你可以为SVG标签为之添加ID属性。也可以为之添加css样式,例如“border-style:solidborder-width:2px”。SVG标签跟其它的HTML标签有通用的属性。你可以用height="100px"

width="200px"

为其添加高度和宽度。

现在就将SVG元素加入到我们HTML代码中,SVG提供很多绘图形状,例如线条、圆、多边形等。

SVG线条:

SVG线条用标签定义,在此标签内你还可以定义其他的属性。

该标签包括像起点坐标(x1,y1)和终点坐标(x2,y2)这样的属性。指定x1,y1,x2,y2值来设定起点终点坐标。在指定好坐标后,可以为之添加一些样式,在style属性中使用“stroke:Green”为线条指定颜色。同样你也可以用stroke-width:2为线条设置宽度。

SVG画圆:

SVG提供了一种不同的标签来画圆。正如你看到的下面代码,circle有个id为myCircle。为了定义圆的中心以及半径,使用cx="55"

cy="55"以及r="50"属性分别定义。使用fill="#219E3E"为圆填充颜色。同样你可以用stroke="#17301D"

stroke-width="2"定义圆周线条颜色和宽度。

SVG矩形:

同样的使用标签来画矩形,我们同样设置了

id

属性

“myRectangle”

,用

width="300"

height="100"

定义高宽,使用

fills

属性定义填充颜色。用

strock

定义边框。还有一点需要注意,我用

fill-opacity="0.5"

stroke-opacity="0.5"

stroke

filling

都添加了透明度。

SVG椭圆:

我们同样是用标签来绘制椭圆。设置其

id="myEllipse"

,给定起中心坐标

cx="120"cy="60",长轴短轴半径

rx="100"

ry="50",并用设置填充颜色、边框宽度以及边框颜色style="fill:#3F5208stroke:blackstroke-width:3"。

SVG多边形:

我们使用特定标签绘制多边形,points属性用来定义多边形的几个顶点,用左边对来定义,形如

points="10,10

75,150

150,60"

,这里定义了三个顶点(10,10),(75,150),(150,60)。同上面一样,用

style="fill:#63BCF7stroke:blackstroke-width:3"

定义多边形填充颜色、边框以及边框宽度。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11763309.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-18
下一篇 2023-05-18

发表评论

登录后才能评论

评论列表(0条)

保存