html 相册是什么?有什么用?

html-css09

html 相册是什么?有什么用?,第1张

html相册就是把一组图片放到一个固定位置轮番滚动查看,一般是类似于qq相册的功能。

代码如下:

<script language="javascript">

//定义img图库

var img = ["","images/1.gif","images/2.gif","images/3.gif","images/4.gif"]//最前面留一个空白位置

//轮番显示

function show(op){

if(Number(op)){

// 取得对应的图片

document.getElementById("img1").src=img[op]

}

}

</script>

//设置图片显示样式

<style type="text/css">

li{

float:left

height:15px

background-color:#FF66FF

border:1px #00FFFF dotted

line-height:15px

}

a{

color:#00FFFF

text-decoration:none

}

</style>

以下是html代码,设置一个img控件,长和宽都是50个像素

<img src="images/1.gif" id="img1" width="50" height="50" />

<ul style="list-style-type:nonewidth:200px">

<li><a href="#" onclick="show(1)">1</a></li><!--点击显示第一张图-->

<li><a href="#" onclick="show(2)">2</a></li><!--点击显示第二张图-->

<li><a href="#" onclick="show(3)">3</a></li><!--点击显示第三张图-->

<li><a href="#" onclick="show(4)">4</a></li><!--点击显示第四张图-->

</ul>

旋转index文件代码:

3D旋转相册

*{

padding:0

margin:0

}

body,

html{

height:100%

}

/*背景图片在这里设置*/

body{

background-image:url("images/beijing.jpg")

background-size:100%100%

}

#box{

width:280px

height:400px

position:fixed

left:0

right:0

top:0

bottom:0

margin:auto

transform-style:preserve-3d

transform:rotateX(0deg)rotateY(0deg)

animation:go45slinearinfinite

}

#boximg{

width:280px

height:400px

position:absolute

left:0

top:0

}

#boximg:nth-child(1){

transform:rotateY(0deg)translateZ(650px)

}

#boximg:nth-child(2){

transform:rotateY(36deg)translateZ(650px)

}

#boximg:nth-child(3){

transform:rotateY(72deg)translateZ(650px)

}

#boximg:nth-child(4){

transform:rotateY(108deg)translateZ(650px)

}

#boximg:nth-child(5){

transform:rotateY(144deg)translateZ(650px)

}

#boximg:nth-child(6){

transform:rotateY(180deg)translateZ(650px)

}

#boximg:nth-child(7){

transform:rotateY(216deg)translateZ(650px)

}

#boximg:nth-child(8){

transform:rotateY(252deg)translateZ(650px)

}

#boximg:nth-child(9){

transform:rotateY(288deg)translateZ(650px)

}

#boximg:nth-child(10){

transform:rotateY(324deg)translateZ(650px)

}

@keyframesgo{

0%{

transform:rotateX(0deg)rotateY(0deg)

}

25%{

transform:rotateX(20deg)rotateY(180deg)

}

50%{

transform:rotateX(0deg)rotateY(360deg)

}

75%{

transform:rotateX(-20deg)rotateY(540deg)

}

100%{

transform:rotateX(0deg)rotateY(720deg)

}

}

images/1.jpg

images/2.jpg

images/3.jpg

images/4.jpg

images/5.jpg

images/6.jpg

images/7.jpg

images/8.jpg

images/9.jpg

images/10.jpg

1. 首先第一步打开手机浏览器。根据下图箭头所指,小编以【百度】为例。

2. 第二步打开软件后,根据下图箭头所指,找到想要下载的视频。

3. 第三步根据下图箭头所指,点击右侧【...】图标。

4. 第四步在弹出的菜单栏中,根据下图箭头所指,点击【复制链接】图标。

5. 第五步退回桌面,根据下图箭头所指,找到并点击【一键去水印】图标。

6. 第六步打开软件后,根据下图箭头所指,点击【提取视频】选项。

7. 第七步在弹出的窗口中,根据下图箭头所指,点击【打开】选项。

8. 最后成功提取视频,根据下图箭头所指,点击底部【保存到相册】即可。

以上就是如何将手机浏览器网页视频下载到相册的方法。