昨夜小楼听风雨

2024年5月20日

摘要：页面结构 <div class="body-brick"> <div class="body-brick-title"> <h2 class="body-brick-title-h2"> 生活电器</h2> <div class="body-brick-title-right"> <ul> <li> 阅读全文

posted @ 2024-05-20 10:39 昨夜小楼听风雨阅读(1) 评论(0) 推荐(0) 编辑

2024年5月19日

微信小程序------功能组件------轮播图

摘要：页面结构 <swiper class="content-info-slide" indicator-color="rgba(255,255,255,.5)" indicator-active-color="#fff" indicator-dots circular autoplay> <swiper 阅读全文

posted @ 2024-05-19 09:19 昨夜小楼听风雨阅读(2) 评论(0) 推荐(0) 编辑

2024年5月18日

网页布局------小米商城官网

摘要：小米商城官网地址小米商城 - Xiaomi 14 Ultra、Redmi K70、MIX FOLD 3，小米电视官方网站一、头部 1、效果图 2、网页结构 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta na 阅读全文

posted @ 2024-05-18 12:37 昨夜小楼听风雨阅读(4) 评论(0) 推荐(0) 编辑

网页布局------导航栏下标缩放显示

摘要：实现迅雷导航栏下班缩放显示效果https://www.xunlei.com/ .nav-bar li::after{ position:abaolute; bottom:0; left:0; content:""; width:100%; height:2px; background-color:b 阅读全文

posted @ 2024-05-18 08:41 昨夜小楼听风雨阅读(1) 评论(0) 推荐(0) 编辑

2024年5月17日

网页布局------鼠标点击标签切换内容

摘要：网页结构 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docu 阅读全文

posted @ 2024-05-17 09:49 昨夜小楼听风雨阅读(2) 评论(0) 推荐(0) 编辑

2024年5月16日

将博客搬至CSDN

摘要：搬家测试阅读全文

posted @ 2024-05-16 21:44 昨夜小楼听风雨阅读(2) 评论(0) 推荐(0) 编辑

网页布局------小米商城页面布局

摘要：小米商城网址：小米商城 - Xiaomi 14 Ultra、Redmi K70、MIX FOLD 3，小米电视官方网站 ps：自己写的代码，会和网址有所差异网页结构 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <me 阅读全文

posted @ 2024-05-16 12:55 昨夜小楼听风雨阅读(3) 评论(0) 推荐(0) 编辑

网页布局-----引入文件

摘要： 1、js文件引入引用js文件需要使用script标签，其中必须要要引入jquery.min.js文件 <script src="./jquery.min.js"></script> <script src="./header.js"></script> 在编写js文件时需要保证DOM加载完成，可以阅读全文

posted @ 2024-05-16 08:41 昨夜小楼听风雨阅读(1) 评论(0) 推荐(0) 编辑

2024年5月15日

网页布局-------页面滚动到一定位置显示返回顶部按钮

摘要：页面结构 <div class="slide-shop"> <ul> <li> <a> <div class="slide-shop-div">  <i class 阅读全文

posted @ 2024-05-15 22:29 昨夜小楼听风雨阅读(3) 评论(0) 推荐(0) 编辑

2024年5月14日

网页布局------鼠标悬浮在图片上，图片进行平移

摘要：实现效果：鼠标悬浮在图片上，图片向上移动一段距离通过平移的方式使图片进行移动 transform:translate(x-value,y-value); 内容向左和向右分别移动将参数设置为正值，向右向上移动将参数设为负值也可以通过设置下面内容单独设置平移方向 transform: transla 阅读全文

posted @ 2024-05-14 16:15 昨夜小楼听风雨阅读(3) 评论(0) 推荐(0) 编辑