隐藏页面特效

团队作业进度报告

今日任务:添加用户头像模块,点击用户头像会跳转到用户个人中心。

主要代码:

1
2
3
4
5
6
7
8
9
10
11
12
<code-pre class="code-pre" id="pre-7eHz2X"><code-line class="line-numbers-rows"></code-line>/*个人中心*/
<code-line class="line-numbers-rows"></code-line>.myhead {
<code-line class="line-numbers-rows"></code-line>    width:84px;
<code-line class="line-numbers-rows"></code-line>    height:84px;
<code-line class="line-numbers-rows"></code-line>    margin-top: -80%;
<code-line class="line-numbers-rows"></code-line>    margin-left: 35%;
<code-line class="line-numbers-rows"></code-line>    background-image: url("../img/userpic.jpg");
<code-line class="line-numbers-rows"></code-line>    background-size: 90% 90%;
<code-line class="line-numbers-rows"></code-line>    border-radius:50%
<code-line class="line-numbers-rows"></code-line>}
<code-line class="line-numbers-rows"></code-line>
</code-pre>

  

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<code-pre class="code-pre" id="pre-kpfd5Q"><code-line class="line-numbers-rows"></code-line><!--主页面头部-->
<code-line class="line-numbers-rows"></code-line>    <div id="header">
<code-line class="line-numbers-rows"></code-line>        <!--电影logo
<code-line class="line-numbers-rows"></code-line>        <div class="logo">
<code-line class="line-numbers-rows"></code-line>            <img src=".\img\logo.png" height="100px" width="100px" />
<code-line class="line-numbers-rows"></code-line>        </div>
<code-line class="line-numbers-rows"></code-line>        -->
<code-line class="line-numbers-rows"></code-line>        <div class="title"><h1 id="title">树懒电影</h1></div>
<code-line class="line-numbers-rows"></code-line>        <div class="container">
<code-line class="line-numbers-rows"></code-line>            <form action="#" class="parent">
<code-line class="line-numbers-rows"></code-line>                <input type="text" class="search" placeholder="电影名称,主演" id="search_head">
<code-line class="line-numbers-rows"></code-line>                <button id="search_head_btn" class="btn_search"></button>
<code-line class="line-numbers-rows"></code-line>            </form>
<code-line class="line-numbers-rows"></code-line>        </div>
<code-line class="line-numbers-rows"></code-line>        <div class="mycenter"><input class="myhead" type="button" value="" id="head_picture"></div>
<code-line class="line-numbers-rows"></code-line>        <!--头像超链接到个人信息页面-->
<code-line class="line-numbers-rows"></code-line>        <script>
<code-line class="line-numbers-rows"></code-line>        var head_picture=document.getElementById("head_picture")
<code-line class="line-numbers-rows"></code-line>         head_picture.onclick=function(){
<code-line class="line-numbers-rows"></code-line>            window.open("/user_pager",'_blank')
<code-line class="line-numbers-rows"></code-line>         }
<code-line class="line-numbers-rows"></code-line>        </script>
<code-line class="line-numbers-rows"></code-line>    </div>
<code-line class="line-numbers-rows"></code-line>
</code-pre>

  


__EOF__

本文作者CherriesOvO
本文链接https://www.cnblogs.com/zyj3955/p/14807770.html
关于博主:评论和私信会在第一时间回复。或者直接私信我。
版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!
声援博主:如果您觉得文章对您有帮助,可以点击文章右下角推荐一下。您的鼓励是博主的最大动力!
posted @   CherriesOvO  阅读(43)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单,K8s 太复杂?w7panel 让容器管理更轻松!
点击右上角即可分享
微信分享提示