精华内容
下载资源
问答
  • Unity实战项目 ☀️| 教你如何在Unity通过 代码获取 URL链接网页 的 标题 等各种信息✨
    万次阅读 多人点赞
    2021-07-06 12:45:28
    • 📢博客主页:https://blog.csdn.net/zhangay1998
    • 📢欢迎点赞 👍 收藏 ⭐留言 📝 如有错误敬请指正!
    • 📢本文由 呆呆敲代码的小Y 原创,首发于 CSDN🙉
    • 📢未来很长,值得我们全力奔赴更美好的生活✨


    🎬如何在Unity中通过 代码获取 URL链接网页 的 标题 等各种信息

    请添加图片描述

    📢前言

    • 前几天开发项目过程中遇到了一个问题&#
    更多相关内容
  • 魔方部分(自动旋转)源码参考慕课上spoc web前端开发课程的案例,链接附上:...(图片名a0,a1,a2,a3,a4,a5,a6的下标1-6在魔方有用) 网页背景音乐: 加入一首世界级电音Summertime(钢琴版)...

     

    主页中融合了魔方的三种形态展示:

    1、普通旋转(代码参考来源:https://www.icourse163.org/spoc/learn/HNKJ-1450726207?tid=1451210449#/learn/content?type=detail&id=1218740982&cid=1226885074

    2、魔方小块飞出后停留一段时间后再飞回(代码参考来源:https://blog.csdn.net/z564359805/article/details/88356547

    3、魔方内部进行交替变形(代码参考来源:https://blog.csdn.net/z564359805/article/details/88356547

    网站地址:

    http://120.79.218.0/

     

     

     

    魔方及网页背景用到的图片

    (图片名a0,a1,a2,a3,a4,a5,a6的下标1-6在魔方中有用)

    img目录下:

     

    img2目录:

    img3目录:

    网页背景音乐:

    加入一首世界级电音Summertime(钢琴版):

    https://www.baidu.com/link?url=5SQ-fQdu0xFv5-EpXLUaWy3juU-URlbUnRfqklzTiTNwOjm8l5WMk_8kmJ-Lua5ediCKC9F4ElIP3NjjYvlrHTMDeGLTYlTOt9Hxt0X74b3&wd=&eqid=fc07018d0000e3ea000000065e9f14ab

     

    代码:

    <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title>ZTY的个人主页</title>
    <audio autoplay="autoplay" controls="controls"loop="loop" preload="auto"
        src="YellowStar - K-391-Summertime钢琴版(YellowStar Bootleg)(YellowStar remix).flac">
      你的浏览器版本太低,不支持audio标签
    </audio>
    
    <style>
        .paragraph
        {
         background-color: darkblue;
         background-image:url(img/java.jpg);
        }
        h1
        {
            text-align: center;
            color:purple;
            font-size: 50px;
        }
        table{
            border:1
            align="center"
            cellpadding="10"
            width="800"
        }
        /*以下为旋转魔方的样式*/
    
        /*三个魔方都共用的正方体框体*/
        .top{
            transform: translateZ(150px);
        }
        .bottom{
            transform:translateZ(-150px) rotateX(180deg);
        }
        .before{
            transform:translateY(150px) rotateX(-90deg);
        }
        .left{
            transform:translateX(-150px) rotateY(-90deg);
        }
        .right{
     
            transform:translateX(150px) rotateY(90deg);
        }
        .after{
            transform:translateY(-150px) rotateX(90deg);
        }
    
    
        /*右边的魔方*/
        .container{
            width: 300px;
            height: 300px;
            position: absolute;
            left: 950px;
            top:  400px;
            perspective: 200000px;
        }
        .box{
            width: 300px;
            height: 300px;
            transform-style: preserve-3d;
            animation: ro 4s linear infinite;
        }
        .box-page{
            width: 300px;
            height: 300px;
            position: absolute;
        }
        @keyframes ro2{
            0%{
                transform: rotateX(0deg) rotateY(0deg);
            }
            100%{
                transform: rotateX(360deg) rotateY(360deg);
            }
        }
    
    
        /*左下方的魔方*/
        .container2{
    		width:300px;
    		height:300px;
            position: absolute;
            left: 100px;
            top:  1000px;
    		perspective:20000px;
    	}
    	.box2{
    		width:300px;
    		height:300px;
    		border:1px solid transparent;
    		box-sizing: border-box;
    		position:relative;
    		transform-style:preserve-3d;
    		animation: rotate 10s linear infinite;
    	}
    	@keyframes rotate{
    		100%{
    		transform:rotatex(360deg) rotatey(360deg) rotatez(360deg);
    			}
    	}
    	.box-page2{
    		width: 300px;
    		height: 300px;
    		position:absolute;
    		box-sizing: border-box;
    		transform-style:preserve-3d;
    	}
     
    	.box-page2 div:first-child,.box-page2 div:nth-child(3),.box-page2 div:nth-child(5),.box-page2 div:nth-child(7),.box-page2 div:nth-child(9){
    		transform: rotateY(0deg);
    		animation: rotatey 6s linear infinite;
    		}
     
    	@keyframes rotatey{
    		20%{
    			transform: rotateY(0deg);
    			background-size: 300px 300px;
    			}
    		40%{
    			transform: rotateY(540deg);
    			background-size: 100px 100px;
    			}
    		60%{
    			transform: rotateY(540deg);
    			background-size: 100px 100px;
    			}
    		80%{
    			transform: rotateY(0deg);
    			background-size:300px 300px;
    			}
    		}
    	.box-page2 div:nth-child(2),.box-page2 div:nth-child(4),.box-page2 div:nth-child(6),.box-page2 div:nth-child(8){
    			transform:rotateX(0deg);
    		    animation: rotatex 6s linear infinite;
    		}
     
    	@keyframes rotatex{
    		20%{
    			transform: rotateX(0deg);
    			background-size: 300px 300px;
    		}
    		40%{
    			transform: rotateX(540deg);
    			background-size: 100px 100px;
    			}
    		60%{
    			transform: rotateX(540deg);
    			background-size: 100px 100px;
    			}
    		80%{
    			transform: rotateX(0deg);
    			background-size: 300px 300px;
    			}
    		}
    
    
        /*第三个右下方的魔方*/
        .container3{
    			width: 300px;
    			height: 300px;
                position: absolute;
                left: 950px;
                top:  1000px;
    			perspective: 20000px;
     
    		}
    	.box3{
    			width: 300px;
    			height: 300px;
    			/*控制子元素保持3D效果*/
    			transform-style: preserve-3d;
    			/*设置盒子旋转-测试代码*/
    			/*transform: rotateX(45deg) rotateY(45deg);*/
    			/*让魔方动起来*/	
    			animation: ro 10s linear infinite;
    			/*animation-direction规定是否应该轮流反向播放动画*/
    			animation-direction: alternate;
     
    		}
    		/*设置动画*/
    	@keyframes ro{
    			0%{
    				transform: rotateX(45deg) rotateY(45deg);
    			}
    			100%{
    				transform: rotateX(360deg) rotateY(360deg);
    			}
    		}
            
    	.box-page3{
    			width: 300px;
    			height: 300px;
    			/*初始化位置*/
    			position: absolute;
    			/*设置3d效果*/
    			transform-style: preserve-3d;
    		}
    
    	.box-page3 div:nth-child(1){
    			animation: a1 4.5s ease-in;			
    		}
    	.box-page3 div:nth-child(2){
    			animation: a1 4.5s ease-in 0.5s;
    		}
    	.box-page3 div:nth-child(3){
    			animation: a1 4.5s ease-in 1s;
    		}
    	.box-page3 div:nth-child(4){
    			animation: a1 4.5s ease-in 1.5s;
    		}
    	.box-page3 div:nth-child(5){
    			animation: a1 4.5s ease-in 2s infinite;
    		}
    	.box-page3 div:nth-child(6){
    			animation: a1 4.5s ease-in 2.5s;
    		}
    	.box-page3 div:nth-child(7){
    			animation: a1 4.5s ease-in 3s;
    		}
    	.box-page3 div:nth-child(8){
    			animation: a1 4.5s ease-in 3.5s;
    		}
    	.box-page3 div:nth-child(9){
    			animation: a1 4.5s ease-in 4s;
    		}
    		/*每个小面的九个图片的动画*/
    	@keyframes a1{			
    			/*不动*/
    			0%{
    				/*scale缩放比例*/
    				transform: translateZ(0px) scale(1) rotateZ(0deg);
    			}
    			/*飞出去,飞没了*/
    			20%{
    				/*scale缩放比例,边飞边旋转*/
    				transform: translateZ(90px) scale(0.5) rotateZ(180deg);
    			}
    			50%{
    				transform: translateZ(180px) scale(0) rotateZ(360deg);
    			}
    			/*飞回来*/
    			80%{
    				transform: translateZ(300px) scale(0.5) rotateZ(720deg);
    			}
    			100%{
    				transform: translateZ(0px) scale(1) rotateZ(0deg);
    			}
    		}
    		
    </style>
    </head>
    
    
    <body class="paragraph">
        <div>
           <h1>ZTYのHome Page</h1>
        </div>
    
        <div class="top-header">
            <p>如果你想更进一步了解我的技术栈的话,可以看看我的博客</p>
                <ul>
                    <li><a href="https://blog.csdn.net/Zhongtongyi">CSDN博客:溪流背坡村er</a></li>
                    <li>QQ:1119094861</li>
                </ul>
        </div>
        <table>
                <tr>
                    <th colspan="7" style="background-color: yellowgreen;" >个人简介</th>
                </tr>
    
                <tr>
                    <th style="background-color: aqua;">姓名:</th><td style="background-color: blue;""> 钟统一</td>
                    <th style="background-color:blueviolet;">年龄:</th><td style="background-color:brown;">19</td>
                    <th style="background-color:cadetblue;">民族:</th><td style="background-color:darkgreen;">汉</td>
                </tr>
                 
                <tr>
                    <th style="background-color:darkorange;">出生年:</th><td style="background-color:deeppink;">2000</td>
                    <th style="background-color:gold;">政治面貌:</th><td style=background-color:yellow;">团员</td>
                    <th style="background-color:yellowgreen;">学历:</th><td style="background-color:teal;">本科</td>
                </tr>
                 
                <tr>
                    <th style="background-color:slateblue;">专业:</th><td style="background-color:sandybrown;">计算机科学与技术</td>
                    <th style="background-color: red;">高中:</th><td><a href="http://www.nanyaedu.com/" style="background-color: wheat;">长沙市南雅中学</a></td>
                    <th style="background-color:red;">现就读学校:</th><td style="background-color:darkblue;">湖南科技大学</td>
                </tr>
                 
                <tr>
                     <th style="background-color:orangered;">爱好:</th><td style="background-color:violet;">敲代码,看书,跑步等</td>
                     <th style="background-color:tomato;">籍贯:</th><td style="background-color: skyblue;">益阳</td>
                     <th style="background-color:peru;">邮箱:</th><td colspan="2" style="background-color: purple;" >zty1119094861@sina.com</td>
                </tr>
                 
                <tr>
                     <th height="160" style="background-color:saddlebrown;">个人特长:</th>
                     <td colspan="6" style="background-color:yellow;"><p>篮球,羽毛球,游泳</p></td>
                </tr>
                 
                <tr>
                     <th height="160" style="background-color:yellow;"> 非一般的大中小学:</th>
                     <td colspan="6" style="background-color:violet;">
                    <p>说起我的经历,可以说是一波三折的,为什么这么说呢?小学在广东,初中在湖南岳阳</p>
                    <p>然后高中考到长沙市南雅中学,大学又在离我高中才30多公里的湘潭</p>
                    <p>讲真高中大学的夏天都是非常热的,为啥?因为湘潭长沙就是一体的,长沙不是四大火炉之一嘛</p>
                </tr>
                 
                <tr>
                     <th height="160" style="background-color: slateblue;">总结:</th>
                     <td colspan="6" style="background-color: peru;">
                    <p>兴趣不多,不追剧不看小说不刷微博不逛B站(保守型),但是我热爱运动:足球篮球乒乓球羽毛球都有涉及</p>
                </tr>
        </table>
    
        <!--第一个最右边的魔方-->
        <div class="container">
            <div class="box">
                <div class="box-page top"></div>
                <div class="box-page bottom"></div>
                <div class="box-page left"></div>
                <div class="box-page right"></div>
                <div class="box-page before"></div>
                <div class="box-page after"></div>
            </div>
        </div>
        </body>
    
        <!--第二个左下方的魔方-->
        <div class="container2">
            <div class="box2">
                <div class="top box-page2"></div>
                <div class="bottom box-page2"></div>
                <div class="left box-page2"></div>
                <div class="right box-page2"></div>
                <div class="before box-page2"></div>
                <div class="after box-page2"></div>
            </div>
        </div>
    
        <!--第三个右下方的魔方-->
        <div class="container3">
            <div class="box3">
                <div class="box-page3 top animation"></div>
                <div class="box-page3 bottom"></div>
                <div class="box-page3 left"></div>
                <div class="box-page3 right"></div>
                <div class="box-page3 before"></div>
                <div class="box-page3 after"></div>
            </div>
        </div>
    
    
    
    <script type="text/javascript">
     //第一个最右边的魔方
        var arr=document.querySelectorAll(".box-page");
        for(var n=0;n<arr.length;n++){
            //外层循环遍历行
            for(var r=0;r<3;r++){
                //内层循环遍历列
                for(var c=0;c<3;c++){
                    var divs=document.createElement("div");
        divs.style.cssText="width:100px;height:100px;border:2px solid #fff;box-sizing:border-box;position:absolute;background-image:url(img/a"+n+".jpg);background-size:300px 300px;";
                    arr[n].appendChild(divs);
                    divs.style.left=c*100+"px";
                    divs.style.top=r*100+"px";
                    divs.style.backgroundPositionX=-c*100+"px";
                    divs.style.backgroundPositionY=-r*100+"px";
                }
            }
        }
    
    
        //第二个左下方的魔方
    	var arr = document.querySelectorAll(".box2>div");
    	for(var n = 0;n<arr.length;n++){
    		for(var i=0;i<3;i++){
    			for(var j=0;j<3;j++){
    				var divs = document.createElement("div");
    				divs.style.cssText = "width:100px;height:100px;border: 1px solid #fff;position:absolute;box-sizing:border-box;background-image:url(img3/a"+n+".jpg);background-size: 300px 300px;";
    				arr[n].appendChild(divs);
     
    				// 改变每一个div的位置
    				divs.style.left = 100*j+"px";
    				divs.style.top = 100*i+"px";
     
    				// 改变背景图相应的位置
    				divs.style.backgroundPositionX = -j*100+"px";
    				divs.style.backgroundPositionY = -i*100+"px";		
    			}
    		}
    	}
    
        //第三个右下方的魔方
    	var arr = document.querySelectorAll(".box-page3");
    	// 遍历六个面
    	for (var n = 0; n < arr.length; n++){
    		// 外循环控制行
    		for (var r = 0; r < 3; r++) {
    			// 内循环控制列
    			for (var c = 0; c < 3; c++) {
    				// 创建元素
    				var divs = document.createElement("div")
    				divs.style.cssText = "width: 100px;height: 100px;border: 2px solid #fff;box-sizing: border-box;position: absolute;background-image: url(img2/a"+n+".jpg);background-size:300px 300px;";
    				arr[n].appendChild(divs);
     
    				divs.style.left = c*100+"px";
    				divs.style.top = r*100+"px";
    				// 背景图像定位
    				divs.style.backgroundPositionX = -c*100+"px";
    				divs.style.backgroundPositionY = -r*100+"px";
    			}
    		}
    	}
    </script>
    </body>
    </html>

     

    展开全文
  • 网页效果: 3.3D效果: 4.游戏互动效果: 5.PPT播放效果: 总结 前言 上期有同学说在设置CSDN自定义模块时入口找不到或无法操作: 那是因为你帐号级别不够,什么意思呢?下面是CSDN官方对此功能的使用提示,就是告诉...

    系列文章目录

    提要:如果你有阅读我上一篇文章,那么恭喜你,你已经学会设置CSDN自定义模块的简单操作模式了,下面的教程将是进阶教程,目的是让你的博客更有气氛、更酷,重点是与众不同。

    简单设置模式回顾:
    《CSDN自定义模块简单设置之——添加模块并填入图片、文字、链接等内容》

    本期高级设置模式:
    《CSDN自定义模块高级设置之(1)——向模块中添加动态效果、网页、3D效果、游戏等互动元素功能》
    《CSDN自定义模块高级设置之(2)——设置主页左则及详情页背景(打造节日气氛)》


    提示:需要设置的朋友们请先收藏本文章,方便日后查看设置


    前言

    上期有同学说在设置CSDN自定义模块时入口找不到或无法操作:
    那是因为你帐号级别不够,什么意思呢?下面是CSDN官方对此功能的使用提示,就是告诉你要支持下CSDN官方,充个会员或去认证博客专家身份,当然帐号企业认证也可以。

    栏目内容支持HTML格式,不支持JS,
    最多添加1个自定义栏目,VIP、博客专家、企业博客才可在个人详情页显示

    博客主页效果:

    博客内容详情页效果:


    提示:图片换成自己的,那不是重点,有兴趣一起交流的朋友请帮忙来个一键三连+评论

    一、CSDN自定义模块进阶设置?

    本次对CSDN自定义模块高级设置功能主要有:向模块中添加动态效果、网页、3D效果、游戏等互动元素功能。听起来就是很厉害,看到效果你就知道了。

    怎么看效果:
    下面这个博客详情页可以看到:看效果传送链接

    连手指都懒得动的可以看下面图片,里面都是动态的效果和可交互的效果。
    在这里插入图片描述

    二、简单模式设置步骤

    1.设置入口

    我们先进行设置入口:

    在这里插入图片描述
    在这里插入图片描述

    2.代码编写

    1.动态效果:

    我们下面开始写代码:

    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo3/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    
    	<p>
    		</div><div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo1/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    

    效果如下:
    在这里插入图片描述
    在这里插入图片描述
    因为是截图,看不出动的效果,可以在电脑上打开下面的链接查看我做的效果:
    查看效果地址(请在电脑上打开查看):查看效果

    代码写完后请将上面代码中复制粘贴到栏目内容里保存。


    2.网页效果:

    我们下面写下代码:

    	<p>
    		</div><div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="【要显示的网页网址】" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    

    请将上面代码中“【中文】”的内容换成自己要添加的网址,其他操作跟上面一样,编写代码后将代码复制粘贴到栏目内容里保存,然后打开自己的任意一篇文章详情页去查看效果。


    3.3D效果:

    我们下面实现3D效果,代码如下:

    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo5/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    

    动态效果如下(这里随机截了三张图):
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
    因为是截图,看不出动的效果,可以在电脑上打开下面的链接查看我做的效果:
    查看效果地址(请在电脑上打开查看):查看效果

    代码写完后请将上面代码中复制粘贴到栏目内容里保存。

    下面我们再来实现一个3D效果,代码如下:

    <p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo11/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    

    动态效果如下(这里同样随机截了三张图):
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
    上面的效果是可以用鼠标去旋转的。

    想尝试的同学可以打开这个链接去旋转看看:
    查看效果

    跟上面操作一样,编写完代码后请将上面代码复制粘贴到栏目内容里保存,然后打开自己任意一篇博文在详情页查看。


    4.游戏互动效果:

    我们下面来实现在游戏并来互动玩下这个游戏,代码如下:

    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo7/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    

    效果如下:
    在这里插入图片描述
    同样想尝试的同学可以打开这个链接去旋转玩玩这个小游戏:
    查看效果

    编写完代码后请将上面代码复制粘贴到栏目内容里保存,然后打开自己任意一篇博文在详情页查看。


    5.PPT播放效果:

    我们下面实现类似播放PPT样的效果做日出日落,代码如下:

    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo9" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    

    效果如下:
    在这里插入图片描述
    同样想尝试的同学可以打开这个链接去通过鼠标滚动向下翻页,当右边滚动条滚到最底部是就播放完了:
    查看效果

    最后同样是编写完代码后请将上面代码复制粘贴到栏目内容里保存,然后打开自己任意一篇博文在详情页查看。


    上面的代码只是部分,下面贴出完整的代码:

    <div>
    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo5/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    	<p>
    		<img src="此处修改为自己的图片地址" alt=""/>
    	</p>
    
    	<hr><hr>
    
    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo11/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    	<p>
    		<a href="此处修改为自己的网页地址" style="color:#FF0000;" target="view_window">加油!继续努力,终有一天你也会成为一名技术大佬!</a> 
    	</p>
    	
    	<hr><hr>
    
    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo3/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    	<p>
    		<span style="color:#A67D3D;">CSDN博客:</span> 
    		<a href="此处修改为自己的博客地址" target="view_window">点击进入</a> 
    	</p>
    	
    	<p>
    		<span style="color:#A67D3D;">博客园博客:</span> 
    		<a href="此处修改为自己的博客地址" target="view_window">点击进入</a> 
    	</p>
    	
    	<hr><hr>
    
    	<p>
    		</div><div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo1/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    	<p>
    		<span style="color:#A67D3D;">个人GitHub:</span> 
    		<a href="此处修改为自己的GitHub地址" target="view_window">点击进入</a> 
    	</p>
    	<p>
    		<span style="color:#A67D3D;">个人Gitee:</span> 
    		<a href="此处修改为自己的Gitte地址" target="view_window">点击进入</a> 
    	</p>
    	
    	<hr><hr>
    
    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo9" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    	<p>
    		<span style="color:#A67D3D;">个人邮箱:</span> 
    		1069945237@qq.com
    	</p>
    	<p>
    		<span style="color:#A67D3D;">个人微信:</span> 
    		huidaoli2010
    	</p>
    
    	<hr><hr>
    
    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo7/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    	<p>
    		<a href="https://www.baidu.com/s?wd=huidaoli" style="color:#FF0000;" target="view_window">代码敲累了,玩个游戏吧!</a> 
    	</p>
    
    	<hr><hr>
    
    	<p>
    		<div style="width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:11;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo12/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    
    	<p>
    		<a href="https://www.baidu.com/s?wd=huidaoli" style="color:#FF0000;" target="view_window">提前祝大家圣诞元旦快乐!!</a> 
    	</p>
    
    	<hr><hr>
    
    	<p>
    		<div style="position: absolute;width:100%; left: 0%; top: 0%; height: 100%; opacity: 1.42; z-index:-1;">
    			<iframe frameborder="0" src="https://www.xzwl1688.com/canvas/demo12/" scrolling="no" style="width: 100%;height: 100%;">
    			</iframe>
    		</div>
    	</p>
    
    </div>
    

    最后的效果就是上面第一张图片效果:

    总结

    今天就先讲这里,相信高级设置模式你已经掌握了,效果是不是更好,下篇文章再给大家讲《CSDN自定义模块高级设置之(2)——设置主页左则及详情页背景(打造节日气氛)》,效果可以到我博客去看:

    以上就是今天要讲的内容,希望大家感兴趣,支持我的同学请点个一键3连。

    展开全文
  • H5页面展示丨网页三维展示丨产品3D展示原理【商迪3D】 H5页面展示,产品3D展示,这些词语相信各位小伙伴们肯定都听过,那么到底什么是网页三维展示呢?商迪3D与你一探究竟!商迪3D可承接全国各个地区产品3D展示,H5...
                          H5页面展示丨网页三维展示丨产品3D展示原理【商迪3D】
    

    H5页面展示,产品3D展示,这些词语相信各位小伙伴们肯定都听过,那么到底什么是网页三维展示呢?商迪3D与你一探究竟!商迪3D可承接全国各个地区产品3D展示,H5页面展示不受时间和空间是限制,网页三维展示适用范围广,小到精细电器元件,大到厂区,变电站都可以展示到网页当中。
    在这里插入图片描述

    一、3D建模是展示基础
    网页三维展示、产品3D展示、任何展示的前提都需要先通过3D软件制作符合网页展示规则模型。商迪3D设计师将通过3D软件将产品一比一还原,制作相对应的材质,使模型与实物相符。
    在这里插入图片描述

    二、three.js是H5页面展示框架
    我们常碰到的H5页面展示、产品3D展示是通过three.js和 webgl展示技术做为底层框架,建立一个展示的虚拟空间画布,然后将3D场景、灯光、3D模型加载应用于H5页面中,使得产品可以在网页端720度展示。

    展开全文
  • C语言 在程序打开网页,模拟鼠标点击、键盘输入 一、简述  记--使用C语言 打开指定网页,并模拟鼠标点击、键盘输入。实现半自动填写账号密码,并登录网站(当然现在的大部分网站都有验证码,或有检测"非人...
  • 在此你可以选择新建一个项目(项目名任意起),或者添加到你原来创建的项目。 我这里新建了一个名为NewTest的项目,如图所示: 准备工作做好了之后,下面我们来具体引用一下这些字体图标。 1、Unico...
  • 教你优雅的处理网页中的图片

    万次阅读 多人点赞 2021-10-19 09:26:57
    俗话说一图胜千言,网页中一张好看的图片,配上精美的文字,定能吸引眼球。 background-image-设置元素的背景图片 定义 将图形(例如 PNG、SVG、JPG、GIF、WEBP)或渐变应用于元素的背景。 有两种不同类型的图像可以...
  • 网页防篡改&WAF

    千次阅读 2019-10-15 11:19:13
    安全产品 网页防篡改 WAF
  • html3D网页实例

    万次阅读 2017-08-25 17:40:20
     现在的网页最求的不仅仅是数据的展示了,我们需要的是让用户产生美感,体验独特,那么酷炫的3D网页就是我们的追求,很多电脑官网或者公司官网都淘汰了那些乏味的平面网页,使用3D网页来满足用户的需求,下面我就...
  • HTML+CSS技术实现网页滑动门效果

    千次阅读 2018-01-05 17:48:04
    大家在网页中经常会见到这样一种导航效果,因为使用频率广泛,所以广大的程序员给它起了一个名字,叫做滑动门.在学习滑动门之前,首先你要了解什么是滑动门。 小米官网,网页滑动门效果 二、实现滑动门所需技术 简单...
  • 手把手带你实现第方应用登录

    千次阅读 多人点赞 2021-08-03 16:02:32
    大家在自己做项目的时候有没有想过实现一个第方应用登录呢?类似这种: 本篇文章就来聊一聊该如何实现第方应用登录。 什么是OAuth2.0 OAuth是一项协议,它为用户资源的授权提供了一个安全、开放而简易的标准,...
  • 网页中嵌入flash文件的几种方法

    万次阅读 2017-01-24 11:54:14
    1. object + embed 传统的方法 优点:浏览器兼容性好,是 Macromedia 一直以来的官方...微软由于种种原因,在 sp2 后限制了 IE 的 ActiveX 的使用模式,就是在页面的 ActiveX 有一个虚框,需要用户点击一次才能正
  • 微信开放平台 和 微信公众平台 概念不同。   ...审批通过之后再创建一个移动应用同样...第方使用网站应用授权登录前请注意已获取相应网页授权作用域(scope=snsapi_login),则可以通过在PC端打开以下链接: ...
  • 如何将html格式动态图表网页嵌入ppt

    千次阅读 热门讨论 2019-09-18 10:54:21
    看了之前推送的REmap相关内容,结果导出的图表是html格式的动态图,不知道如何将此种格式的图表放在ppt使用。...当然这个情况在r语言其实很普遍,很多依赖底层js语言编写的二次开发包(比如R语言的rechar...
  • 抖音上很火的H53D立体动态相册效果

    千次阅读 2019-12-03 18:20:48
    动态效果图 源码Demo: 一、新建一个index.html的文件,代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>纯CSS实现鼠标经过...
  • 纯HTML+CSS网页设计期末作业(个人网站)

    万次阅读 多人点赞 2021-11-14 18:38:21
    目录纯HTML+CSS网页设计期末作业(个人网站)效果展示源码index.htmlindex.cssabout.htmlhobbies.htmlhobbies.cssme.htmlme.cssbook1.htmlbook.csssongci.htmlsongci.css缺陷 纯HTML+CSS网页设计期末作业(个人网站...
  • 文章目录Vue + webGL + unity3D1. 什么是webGL?... 演示效果 Vue + webGL + unity3D 1. 什么是webGL? WebGL(Web图形库)是一个JavaScript API,可在任何兼容的Web浏览器渲染高性能的交互式3D和2D图形
  • HTML期末大作业~制作个人图片资源网页5个页面(HTML+CSS+JavaScript) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?...你想要解决的问题,在这篇博文基本都...
  • web前端开发技术期末大作业 网页规划与制造,做得...一、网页效果(模仿游戏官网) A.首页效果 B.游戏攻略 C.手办商城 上面就是网站的部分效果,其他就不贴出来了哈哈哈,仅作分享 二、主要代码 首页HTML <!DOCTY
  • unity打开网页

    千次阅读 2018-12-12 11:56:39
    unity里面打开网页接触了一些,没做深入研究,仅以简单展示网页为主。分为两类,一是PC端打开网页,二是android端打开网页网页插件或方案 Unity之PC版,window。如果网页只是单独二维码图片,则采用www请求...
  • 从网站某一个页面(通常是首页)开始,读取网页的内容,找到在网页中的其它链接地址,然后通过这些链接地址寻找下一个网页,这样一直循环下去,直到把这个网站所有的网页都抓取完为止。 网络爬虫的基本操作是抓取...
  • 微信网页方登录原理

    千次阅读 2016-12-13 18:01:34
    微信网页方登录原理 标签: 微信开放平台和公众平台的区别 1.公众平台面向的时普通的用户,比如自媒体和媒体,企业官方微信公众账号运营人员使用,当然你所在的团队或者公司有实力去开发一些内容...
  • HTML5 向网页嵌入视频和音频

    千次阅读 2020-12-11 12:00:00
    来源 |http://www.fly63.com/article/detial/9503现在很多网站上都会使用到视频和音频,html5 提供了展示视频和音频的标签。向网页嵌入视频可以...
  • 百度云直链下载-IDM+网页解析(

    万次阅读 2021-07-31 21:58:01
    百度云直链下载-IDM+网页解析 解析网页教程<一>获取解析链接<二>IDM下载相关分享百度云直链下载-IDM(一)百度云直链下载-Aria2(二)百度云下载官方免费提速方案百度云高速下载器 kinhdown 解析网页 解析...
  • HTML静态网页作业——海贼王主题网页设计制作6个页面(HTML+CSS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?...你想要解决的问题,在这篇博文基本都能满足你的需求~...
  • 屏蔽UC强制嵌入到网页的垃圾广告方法第二版

    万次阅读 热门讨论 2018-04-13 13:28:16
    先强烈谴责鄙视下UC 这种无耻的、明目张胆的劫持网站流量的强盗行为 ...但最近发现已经失效了,犯贱的UC 果然没有让人失望,做了许多反屏蔽措施。...先说明下,此文方法测试于 2018年04月13号 ,不确定此日...
  • 本文章属于《滚雪球学 Python 第轮》的一篇,欢迎继续关注。 今天是持续写作的第 143 / 200 天。可以点赞、评论、收藏啦。 继续阅读 游走在 “法律边缘” 的数据采集者,直播梳理 CSDN 首发,收藏并实践本文,...
  • HTML5+CSS期末大作业:个人网也设计——明星主页介绍(7页) 带表单带音乐表格布局...你想要解决的问题,在这篇博文基本都能满足你的需求~ 3.原始HTML+CSS+JS页面设计, web大学生网页设计作业源码,
  • 为了更方便与客户的交流,我们经常会在网页中引用QQ,实现随时都与客户联系的效果。 有多种代码: 一、文字类型的: 1、http://wpa.qq.com/msgrd?V=1&Uin=你的QQ号码&Site=你的注释与说明;Menu=yes">你的...
  • 网页中实现分页功能的几种方法

    万次阅读 2018-02-10 16:06:40
    当我们在做一些类似于贴吧展示帖子这种项目的时候,由于帖子的数量比较多,就会用到...2. 然后再从数据库提取相关数量的记录,将这些提取出来的记录显示在页面上。a. 从数据库提取有限的记录时,我们用到的sql...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 93,834
精华内容 37,533
关键字:

网页中的三d效果