06 2022 档案
摘要：自定义圆点图标： html结构： css样式： 效果： 实心圆点图标： 清除默认样式： ul,li{ padding:0;margin:0;list-style:none} 设置li前面为指定图像，在ul样式下加上： list-style-image: url(../img/ul_list.png)
阅读全文
摘要：没有包装div或其他无用代码的纯CSS解决方案： img { object-fit: cover; width:230px; height:230px;} 参考链接：https://www.codenong.com/15167545/
阅读全文
摘要：<div class="apply_box_three"> <div>提交</div> <div class="apply_box_three_right">重置</div> </div> <script> $(".apply_box_three_right").off().on('click',f
阅读全文
摘要：var url = location.search; if(url.indexOf("?")!= -1){ var str = url.substr(1); strs = str.split("="); } console.log(strs[1]); 参考链接：https://wenku.baidu
阅读全文
摘要：效果： css代码： .course_box { margin-left: 6px; margin-right: 6px; width: 100%; border-radius: 4px; box-shadow: 0 2px 6px rgba(0,0,0,.1); cursor: pointer;
阅读全文
摘要：效果：有8个一级导航（第一张图片），点击进入后，有二级导航以及页面内容（第二三张图片）。 html结构（代码在后面）： 1 <!-- 主要内容（移动端） --> 2 <div class="col-xs col-sm hidden-md hidden-lg centerbox"> 3 <!-- 包含
阅读全文
摘要：效果： 左侧导航结构代码：绑定id名为pcnav 右侧结构代码：绑定id名为pcson jq代码： 1 // PC端的nav切换 2 $("#pcnav>li:eq(0)").addClass('centerbox_in_disc'); // 第一个nav标红 3 $("#pcson>div").h
阅读全文
摘要：结构：绑定id jq代码： 1 // PC端的nav切换 2 $("#pcnav>li:eq(0)").addClass('centerbox_in_disc'); // 第一个nav标红 3 $("#pcson>div").hide(); 4 $("#pcson>div:eq(0)").show(
阅读全文
摘要：1、流式布局：百分比自适应布局 pc端可以通过设置版心来,完成不同屏幕的适配？ 移动端一般采用流式布局(百分比布局) 1. 高度定死,宽度自适应 2. 对于大的轮播图等,宽度100%自适应 3. 对于小图标挥着文本,一般都是固定宽高大小 流式布局的缺点: 对于大屏幕来说,用户体验并不是特别好,有些布
阅读全文
摘要：效果： 在自适应PC端跟移动端的情况下，轮播图的图片在移动端显示太扁太小，所以需要截取中间的主要内容对其进行放大，图片左右留白不显示。 移动端（设置前）： 移动端（设置后）： 代码： 结构： 写样式 （放大比例136%）： .swiper-slide { width: 100%; overflow:
阅读全文
摘要：效果： heml： <div class="index_top_in_box"> <!-- 背景 --> <div class="index_top_in_box_bg"></div> </div> css: .index_top_in_box { display: flex; flex-direc
阅读全文
摘要：效果： 结构： JS代码： $(document).ready(function() { // 下拉菜单的显隐 $(".nav_son").hide(); $(".nav_son_box").hide(); $(".headbox_second_nav>div").hover(function(){
阅读全文
摘要：呈现效果： 使用插件： uni-data-picker 数据驱动的picker选择器 插件下载地址： https://ext.dcloud.net.cn/plugin?id=3796 放到对应的目录： 结构代码： 1 <!-- ↓↓↓↓ 此处使用的插件 ↓↓↓↓ --> 2 <uni-data-pi
阅读全文
摘要：首先，结构代码加上这个： :scroll-top="scrollTop" @scroll="scroll" 然后，data数组加上这两个： scrollTop: 0, // 滚动条位置，距顶为0 oldScrollTop: 0, 在方法里面写这个： scroll (e) { //记录scroll 位
阅读全文
