【网页设计】前端代码练习（七）

已于 2024-07-17 18:50:37 修改
阅读量268 收藏 3
点赞数 2
分类专栏： 网页设计 文章标签： 前端 css css3 html 学习
于 2024-07-17 18:45:08 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_64077978/article/details/140502616
版权

制作多个css滑动门按钮

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

*{padding:0;margin:0;text-decoration:none;}

div{margin:20px auto;}

span,a{display:inline-block;}

a{margin-right:10px;}

p{color:#000;font-weight:bold;margin-bottom:10px;}

span{float:left;height:30px;}

.left{width:8px;background:url(images/2.left.gif);}

.middle{background:url(images/2.middle.gif);line-height:30px;color:#FFF;font-size:12px;}

.right{width:10px;background:url(file:///C|/Users/lenovo/Desktop/yl/images/2.right.gif);}

a:hover .left{width:8px;background:url(images/2.left.gif); background-position:0 -30px;}

a:hover .middle{background:url(images/2.middle.gif);line-height:30px;background-position:0 -30px;color:#000;font-size:12px;}

a:hover .right{width:10px;background:url(file:///C|/Users/lenovo/Desktop/yl/images/2.right.gif);background-position:0 -30px;}

</style>

</head>



<body>

<div>

<p>制作多个css滑动门按钮</p>

        <a href="#">

            <span class="left"></span>

        <span class="middle">首页</span>

        <span class="right"></span>

    </a>

        <a href="#">

            <span class="left"></span>

        <span class="middle">关于我们</span>

        <span class="right"></span>

   </a>

        <a href="#">

            <span class="left"></span>

        <span class="middle">联系我们</span>

        <span class="right"></span>

    </a>

        <a href="#">

            <span class="left"></span>

        <span class="middle">我们的优势</span>

        <span class="right"></span>

    </a>

        <a href="#">

            <span class="left"></span>

        <span class="middle">css自适应宽带圆角按钮</span>

        <span class="right"></span>

    </a>

</div>

</body>

</html>

制作单个滑动门按钮

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

*{padding:0;margin:0px;}

p{margin:20px auto;}

span{float:left;height:40px;}

.left{width:6px;background:url(images/left.jpg);}

.middle{background:url(images/middle.jpg);font-size:18px;line-height:40px;}

.right{width:6px;background:url(images/right.jpg);}

</style>

</head>



<body>

<p>

        <span class="left"></span>

    <span class="middle">制作单个滑动门按钮</span>

    <span class="right"></span>

</p>

</body>

</html>

同级元素应用负margin

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

*{padding:0;margin:0;}

.all{margin:20px auto;}

.left{width:169px;height:168px;background:url(images/round.png);float:left;}

.right{width:169px;height:168px;background:url(images/round.png);

background-position:169px 0;float:left;margin-left:-64px;}

</style>

</head>



<body>

<div class="all">

        <div class="left"></div>

        <div class="right"></div>

</div>

</body>

</html>

 导航条


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

*{padding:0;margin:0;list-style:none;text-decoration:none;}

.all{width:755px;margin:20px auto;}

a,span{display:inline-block;}

a{margin-right:-20px;}

span{height:30px;}

a .left{width:23px;background:url(images2/bar4.png);float:left;}

a .middle{background:url(images2/middle.png);float:left;line-height:30px;color:#858585;padding:0 10px;}

a .right{width:23px;background:url(images2/bar2.png);float:left;}

a:hover .left{width:23px;background:url(images2/bar3.png);float:left;}

a:hover .middle{background:url(images2/middle2.png);float:left;line-height:30px;color:#165369;padding:0 10px;}

a:hover .right{width:23px;background:url(images2/bar1.png);float:left;}

.top{height:30px;border-bottom:5px solid #3BBBD5;}

ul{background:#F1F1F1;height:40px;}

li{float:left;background:url(images2/1.png) no-repeat;padding-left:20px;height:16px;line-height:16px;margin-top:12px;margin-left:10px;color:#A3A5A6;}

.one{background-position:0 -16px;}

.two{background-position:0 -32px;}

.three{background-position:0 -48px;}

.four{background-position:0 -64px;}

.five{background-position:0 -80px;}

</style>

</head>



<body>

<div class="all">

<div class="top">

        <a href="#">

            <span class="left"></span>

        <span class="middle">首页</span>

        <span class="right"></span>

    </a>

        <a href="#">

            <span class="left"></span>

        <span class="middle">公司简介</span>

        <span class="right"></span>

   </a>

        <a href="#">

            <span class="left"></span>

        <span class="middle">项目展示</span>

        <span class="right"></span>

    </a>

        <a href="#">

            <span class="left"></span>

        <span class="middle">企业架构和企业文化</span>

        <span class="right"></span>

    </a>

        <a href="#">

            <span class="left"></span>

        <span class="middle">项目展示</span>

        <span class="right"></span>

    </a>

    <a href="#">

            <span class="left"></span>

        <span class="middle">联系我们</span>

        <span class="right"></span>

    </a>

</div>

    <ul>

            <li>分享到：</li>

        <li class="one">QQ好友</li>

        <li class="two">QQ空间</li>

        <li class="three">腾讯微博</li>

        <li class="four">新浪微博</li>

            <li class="five">百度贴吧</li>

    </ul>

</div>

</body>

</html>

页面布局

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{padding:0;margin:0;}
div{width:980px;background:#ccc;font-size:20px;font-family:"微软雅黑";font-weight:bold;text-align:center;margin:0 auto;margin-bottom:10px;}
.header{height:48px;}
.nav{height:30px;}
.banner{height:80px;}
.conter{background:#FFF;}
.left,.right,.center{height:300px;background:#CCC;float:left;}
.left{width:280px;margin-right:5px;}
.center{width:420px;margin-right:5px;}
.right{width:270px;}
.footer{height:100px;clear:both;}	
</style>
</head>

<body>
<div class="header">头部</div>
<div class="nav">导航栏</div>
<div class="banner">焦点图</div>
<div class="content">
	<div class="left">内容左部分</div>
    <div class="center">内容中间部分</div>
    <div class="right">内容右部分</div>
</div>
<div class="footer">页面底部</div>
</body>
</html>

 

导航栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{padding:0;margin:0;list-style:none;text-decoration:none;}
.all{width:755px;margin:20px auto;}
a,span{display:inline-block;}
a{margin-right:-20px;}
span{height:30px;}
a .left{width:23px;background:url(images2/bar4.png);float:left;}
a .middle{background:url(images2/middle.png);float:left;line-height:30px;color:#858585;padding:0 10px;}
a .right{width:23px;background:url(images2/bar2.png);float:left;}
a:hover .left{width:23px;background:url(images2/bar3.png);float:left;}
a:hover .middle{background:url(images2/middle2.png);float:left;line-height:30px;color:#165369;padding:0 10px;}
a:hover .right{width:23px;background:url(images2/bar1.png);float:left;}
.top{height:30px;border-bottom:5px solid #3BBBD5;}
ul{background:#F1F1F1;height:40px;}
li{float:left;background:url(images2/1.png) no-repeat;padding-left:20px;height:16px;line-height:16px;margin-top:12px;margin-left:10px;color:#A3A5A6;}
.one{background-position:0 -16px;}
.two{background-position:0 -32px;}
.three{background-position:0 -48px;}
.four{background-position:0 -64px;}
.five{background-position:0 -80px;}
</style>
</head>

<body>
<div class="all">
<div class="top">
	<a href="#">
    	<span class="left"></span>
        <span class="middle">首页</span>
        <span class="right"></span>
    </a>
	<a href="#">
    	<span class="left"></span>
        <span class="middle">公司简介</span>
        <span class="right"></span>
   </a>
	<a href="#">
    	<span class="left"></span>
        <span class="middle">项目展示</span>
        <span class="right"></span>
    </a>
	<a href="#">
    	<span class="left"></span>
        <span class="middle">企业架构和企业文化</span>
        <span class="right"></span>
    </a>
	<a href="#">
    	<span class="left"></span>
        <span class="middle">项目展示</span>
        <span class="right"></span>
    </a>
    <a href="#">
    	<span class="left"></span>
        <span class="middle">联系我们</span>
        <span class="right"></span>
    </a>
</div>
    <ul>
    	<li>分享到：</li>
        <li class="one">QQ好友</li>
        <li class="two">QQ空间</li>
        <li class="three">腾讯微博</li>
        <li class="four">新浪微博</li>
    	<li class="five">百度贴吧</li>
    </ul>
</div>
</body>
</html>

 精品课程

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body,h3,ul,li{padding:0;margin:0;list-style:none;}
body{font-size:12px;color:#535353;}
a{color:#535353;text-decoration:none;}
a:hover{color:#fd4a13;}
.course{width:218px;height:303px;background-image:url(images/course_bg.png);padding:27px 0 0 15px;margin:20px auto;}
.course h3{font-size:12px;color:#393939;height:40px;}
.course h3 span{font-weight:normal;padding-left:6px;font-family:Arial, Helvetica, sans-serif;font-size:11px;}
.course ul li{width:203px;height:40px;boder:1px solid #e8e8e8;margin-bottom:10px;background:url(images/icon.png) no-repeat right 0 #FFF;}
.course ul li a{display:block;height:19px;line-height:19px;border-left:4px solid #0080db;margin-top:10px;padding-left:15px;margin-left:-1px;}
.course .course_2 a{border-left:4px solid #61a301;}
.course .course_3 a{border-left:4px solid #f50149;}
.course .course_4 a{border-left:4px solid #995f91;}
.course .course_5 a{border-left:4px solid #ffb409;}
.course .course_2{background-position:right -40px;}
.course .course_3{background-position:right -80px;}
.course .course_4{background-position:right -120px;}
.course .course_5{background-position:right -160px;}
</style>
</head>

<body>
<div class="course">
	<h3>精品课程<span>Courses</span></h3>
	<ul>
    	<li><a href="#">电子商务综合实训</a></li>
        <li class="course_2"><a href="#">电子商务实务</a></li>
    	<li class="course_3"><a href="#">现代物流基础</a></li>
        <li class="course_4"><a href="#">网络营销</a></li>
        <li class="course_5"><a href="#">photoshop图像处理</a></li> 
    </ul>
</div>
</body>
</html>

页面布局

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body{margin:0;padding:0;font-size:24px;text-align:center;}
#top{width:980px;height:50px;background-color:#CCC;margin:0 auto;}
#topbar{width:100%;height:30px;background-color:#CCC;margin:5px auto;}
	.nav{width:980px;height:30px;background-color:#CCC;margin:0 auto;}
#banner{width:980px;height:80px;background-color:#CCC;margin:0 auto;}
#content{width:980px;height:300px;background-color:#CCC;margin:5px auto;overflow:hidden;}
#footer{width:100%;height:120px;background-color:#CCC;}
	.inner{width:980px;height:120px;background-color:#CCC;margin:0 auto;}
</style>
</head>

<body>
<div id="top">头部</div>
<div id="topbar">
	<div class="nav">导航栏</div>
</div>
<div id="banner">焦点图</div>
<div id="content">内容</div>
<div id="footer">
	<div class="inner">页面底部</div>
</div>
</body>
</html>

margin负值

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.big{width:100px;height:100px;border:5px solid #333;background-color:#CCC;}
.small{width:30px;height:30px;background-color:#FF0;margin-top:30px;margin-left:-10px;}

</style>
</head>

<body>
<div class="big">
	<div class="small"></div>
</div>
</body>
</html>

招聘信息

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body{font-size:12px;font-family:"宋体";color:#222;}
body,h2,ul,li{padding:0;margin:0;list-style:none;}
.all{
	width:233px;
	height:200px;
	margin:20px auto;
}
.head{
	font-size:12px;
	color:#393939;
	height:30px;
	line-height:30px;
	border:1px solid #d6d6d6;
	border-bottom:1px solid #808080;
	background:url(images/02.png) no-repeat 11px 7px;
	padding-left:34px;
}
.content{padding:25px 0 0 25px;}
.content li{
	height:26px;
	background:url(images/02.png) no-repeat left top;
	padding-left:22px;
}
.content li a:link,.content li a:visited{
	color:#222;
	text-decoration:none;
}
.content li a:hover{
	color:#FD4913;
}
</style>
</head>

<body>
<div class="all">
	<h2 class="head">招聘信息</h2>
	<ul class="content">
    	<li><a href="#">北京XXXX信息科技招聘人才</a></li>
        <li><a href="#">上海XXXX科技招聘工程师</a></li>
        <li><a href="#">永特XXXX招聘网络管理员</a></li>
        <li><a href="#">中国XXXX研究所招聘实习生</a></li>
        <li><a href="#">上海XXXX科技招聘php人才</a></li>
    </ul>
</div>
</body>
</html>

成绩表格

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>


<body>
<table>
	<tr>
    	<td>姓名</td>
    	<td>语文</td>
    	<td>数学</td>
    	<td>英语</td>
    </tr>
    <tr>
    	<td>Mike</td>
    	<td>95</td>
    	<td>80</td>
    	<td>90</td>
    </tr>
    <tr>
    	<td>Lucy</td>
    	<td>85</td>
    	<td>90</td>
    	<td>70</td>
    </tr>
    <tr>
    	<td>Tom</td>
    	<td>80</td>
    	<td>100</td>
    	<td>95</td>
    </tr>
</table>
</body>
</html>

滑动门

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body,ul,li{padding:0;margin:0;list-style:none;}
.all{width:500px;margin:20px auto;height:35px;line-height:35px;}
.all li{float:left;}
.all a,.all span{display:inline-block;height:35px;float:left;}
.one{width:7px;background:url(images-%E7%B2%BE%E7%81%B5%E9%97%A8/hd_left.png);}
.two{width:25px;background:url(images-%E7%B2%BE%E7%81%B5%E9%97%A8/hd_right.png);}
.all a:link,.all a:visited{color:#FFF;font-size:12px;text-decoration:none;background:url(images-%E7%B2%BE%E7%81%B5%E9%97%A8/hd_middle.png) repeat-x;padding:0 5px;
</style>
</head>

<body>
<ul class="all">
	<li>
    	<span class="one"></span>
        <a href="#">首页</a>
        <span class="two"></span>
    </li>
	<li>
    	<span class="one"></span>
        <a href="#">传智播客</a>
        <span class="two"></span>
    </li>
	<li>
    	<span class="one"></span>
        <a href="#">就业指导信息</a>
        <span class="two"></span>
    </li>
	<li>
    	<span class="one"></span>
        <a href="#">留言簿</a>
        <span class="two"></span>
    </li>
	<li>
    	<span class="one"></span>
        <a href="#">添加友情链接</a>
        <span class="two"></span>
    </li>

</ul>
</body>
</html>

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.first,.second{width:219px;height:35px;float:left;background:url(images-%E7%B2%BE%E7%81%B5%E9%97%A8/bg.png);}
.second{background-position:0 -40px;margin-left:-8px;}
</style>
</head>

<body>
<div class="first"></div>
<div class="second"></div>
</body>
</html>

 

 压线

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.itcast{width:300px;height:50px;margin:20px auto;}
a{width:105px;height:50px;display:block;float:left;background:url(images-%E7%B2%BE%E7%81%B5%E9%97%A8/login.jpg);}
.login{width:92px;background-position:-105px 0;}
.open{width:103px;background-position:-197px 0;}
.register:hover{background-position:0 -50px;}
.login:hover{width:94px;background-position:-103px -50px;margin-left:-2px;}
.open:hover{width:105px;background-position:-195px -50px;margin-left:-2px}
</style>
</head>

<body>
<div class="itcast">
	<a href="#" class="register"></a>
	<a href="#" class="login"></a>
    <a href="#" class="open"></a>
</div>
</body>
</html>

pitytheriver
关注
专栏目录
jQuery网页版键盘打字练习代码
06-10
**jQuery网页版键盘打字练习代码详解** 在网页开发中，有时我们需要创建一些互动性强、用户体验良好的功能，比如打字练习应用。这个“jQuery网页版键盘打字练习代码”就是一个典型的例子，它允许用户通过鼠标或键盘...
一些前端和golang练习代码
06-07
通过实际的代码练习，学习者可以更好地理解这两个领域的核心概念，以及它们如何协同工作以创建完整的Web应用。 【标签】： 1. **前端**：前端开发通常涉及HTML、CSS和JavaScript，用于创建网页和应用程序的视觉部分...
源代码_前端网页制作_
09-30
【标题】"源代码_前端网页制作_" 涉及的知识点主要集中在前端开发领域，尤其是网页构建的基础和实践方面。前端开发是互联网应用的重要组成部分，它负责将设计师的创意和用户界面转化为可交互的网页。这个压缩包可能...
前端网页设计作业网页模板
04-28
在前端网页设计领域，网页模板扮演着至关重要的角色，它们为初学者和专业人士提供了一个快速构建网站的基础框架。"前端网页设计作业网页模板"通常包含了HTML、CSS、JavaScript等核心前端技术的预设布局和样式，帮助...
前端练习代码之css2.1
04-12
这个名为"前端练习代码之css2.1"的压缩包文件，显然是为初学者或者正在进阶的前端开发者设计的一系列练习项目，旨在帮助他们深入理解和熟练应用CSS2.1规范。CSS2.1是CSS的一个关键版本，它在2011年成为W3C推荐标准，...
-webkit-box-reflect属性与倒影效果的实现
读心悦
09-13 432
是一个非标准的 CSS 属性，主要用于在 WebKit 浏览器（如 Chrome 和 Safari）中创建元素的倒影效果。这个属性并不是 CSS 规范的一部分，但在实践中经常被用来实现简单而有趣的视觉效果。
Vue使用query传参Boolean类型，刷新之后转换为String问题
q879936814的博客
09-12 429
要解决这个问题，不能直接Boolean处理，因为如果传入false，那么转换成字符串，Boolean(‘false’)会变成true；做项目时发现第一次进入页面时传参是正常的Boolean类型，刷新之后变成了String，这是浏览器进行的一次强制转换；解决方法：使用JSON.parse处理参数。
计算机毕业设计 基于SpringBoot的课程教学平台的设计与实现 Java+SpringBoot+Vue 前后端分离 文档报告 代码讲解 安装调试
weixin_19164791635
09-12 941
本文介绍了一款基于Java、SpringBoot和Vue.js技术的课程教学平台。该平台服务于管理员、学生和教师，提供教学资源管理、课程信息浏览、作业提交与批改等功能，旨在优化教学流程，提升教育质量，促进教育资源的数字化共享，推动教育信息化发展。
（微服务项目）新闻头条——Day1
weixin_73253843的博客
09-13 1142
（微服务项目）新闻头条——Day1
一文读懂 JS 中的 Set 结构
沐爸的博客
09-11 1020
Set 如何使用？和 Map 有什么区别？有哪些属性和方法？又有哪些使用场景？WeakMap 又是什么？
TypeScript 快速上⼿ （3：装饰器）
最新发布
每天都要努力学习哦~~
09-15 716
装饰器本质是一种特殊的函数，它可以对：类、属性、方法、参数进行扩展，同时能让代码更简洁。装饰器自2015年在中被提出到现在，已将近10年。截止目前，装饰器依然是实验性特性 ，需要开发者手动调整配置，来开启装饰器支持。装饰器有 5 种：1⃣类装饰器2⃣属性装饰器3⃣方法装饰器4⃣访问器装饰器5⃣参数装饰器备注：虽然中可以直接使用**类装饰器**，但为了确保其他装饰器可用，现阶段使用时，仍建议使用配置来开启装饰器支持，而且不排除在来的版本中，官方会进一步调整装饰器的相关语法！
完整版订单超时自动取消功能
qq_49979552的博客
09-15 1239
前几天对实习还是继续学习技术产生了抉择，问了一个前辈，他抛给我一个问题，怎么做15分钟订单自动取消，我说然后到时间之后，自动执行这个订单关闭业务，比如把锁了的库存给解开等等操作，然后在数据库里肯定要有体现，比如抖音，查我的订单内一块，在前段应该显示已过期，把支付的按钮变灰或者取消，支付的时候不能直接对库存进行操作，应该是支付模块调用订单模块调用库存模块。然后把理论予以实现，发现需要考虑的点还是有一些的。
react 基础语法
小白小白从不日别的博客
09-13 1752
React 官方中文文档目前前端最流行的是三大框架：Vue、React、Angularreact是一个用于构建用户界面的 JavaScript 库react官网(Reactreact中文网(React 官方中文文档React 是一个用于构建用户界面（UI，对咱们前端来说，简单理解为：HTML 页面）的 JavaScript 库Vue 是一个渐进式的 JavaScript 框架如果从mvc的角度来看，React仅仅是视图层（V）的解决方案。也就是只负责视图的渲染，并非提供了完整了M和C的功能。
前端——JS基础
m0_73557953的博客
09-12 235
字符串函数判断语句对象数组字符串、数字对象循环类和继承错误捕获3个点操作符回调函数和匿名函数。
React 中的事件绑定与参数传递
正是修行时，正是修行时，正式修行时...
09-11 467
React 中的事件绑定与参数传递
在子组件中使用props用于在父组件中给子组件变量设置值
ithongchou的博客
09-13 153
/传给父组件传值到此组件。
项目中遇到的问题
qiao
09-12 460
文件列表中有文件上传功能，点击上传按钮，弹出模态框，在模态框的形式选择文件，进行上传。
NEXT.js pageRouter useParams/useSearchParams 拿不到路由参数
weixin_44240581的博客
09-12 342
NEXT.js pageRouter useParams/useSearchParams 拿不到路由参数
react crash course 2024 (1)理论概念
2301_78916954的博客
09-14 361
而无需写一个class。
HTML网页设计与基础测试题解析
HTML网页设测试题集是一套针对HTML网页设计基础理论和实践技能的考试题目集，旨在帮助学习者掌握HTML语言的核心概念、样式表应用、脚本编写以及网页事件处理等方面的知识。以下是部分题目及其解析： 1. 样式表相关...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值