大师网-带你快速走向大师之路 解决你在学习过程中的疑惑,带你快速进入大师之门。节省时间,提升效率

自适应缩放图文列表

margin: 0;imgWrp { width: 0; background-repeat: no-repeat; flex-flow: row nowrap; } li p { width: 70% } li以display:flex来展现,这样的话,里面的div和p这类子元素可以很好的控制,比float好用多了。 flex-flow控制子元素的方向和是否换行, justify-content: space-around;设定子元素的主轴排列方式,align-items: center;

vue中for循环的class绑定事件

vue中for循环的class绑定事件 {{item.MALL_CATEGORY_NAME}} data() { return { categoryIndex : 0, } }, methods: { clickCategory(index){ this.categoryIndex = index; } }

Python 五点搞定作用域

Python 五点搞定作用域 转自:Python中国开发者社区 1、块级作用域想想此时运行下面的程序会有输出吗?执行会成功吗? 块级作用域if1==1:name="lzl"print(name)foriinrange(10):age=iprint(age 1、块级作用域 想想此时运行下面的程序会有输出吗?执行会成功吗? #块级作用域 if 1 == 1: name = "lzl" print(name) for i in range(10): age = i print(age) 我们先看下执行结果 C:/Users/L/PycharmProjects/s14/preview/Day8/作用域/

手风琴效果 transition使用

手风琴效果 transition使用 手风琴效果 *{ margin: 0; } ul{ list-style: none; width: 960px; height: 300px; border: 1px solid seagreen; margin: 90px auto; overflow: hidden; } ul li{ float: left; width: 160px; /*添加动画效果*/ transition: all 0.3s; } /*所有的li都变小*/ ul:hover li{ width: 60px; } /*当前的li变大*/ ul li:hover{ width: 600px;动画前.png 动画后.png

jq内容按钮点击,就等于触发了左边的导航

jq内容按钮点击,就等于触发了左边的导航 页面效果图 html: 左边导航,这里类似teb,点击切换,使用了bootstrap插件写的 内容布局,每一块里面都添加了上下一篇按钮 js: $(function () { //循环内容里面的li $(".omapp-foot-btn ul").find("li").children("a").attr("href"); //console.log(objhref + "---------"); console.log(objUrl); //var aa = viewTitle.indexOf(objUrl);addClass("active");removeClass("active");animate({ scrollTop: 0 }, 500);

jQuery

jQuery 加载延迟 1、选择器 基本:first :last :even :odd :not :eq() 内容contains 内容包含某某某的节点 $('li:contains("晓")').css('backgroundColor', 'cyan') // 属性name值为user的input $('input[name=user]').removeAttr('class') prop()经常用来设置checked、selected等属性,设置的值就是true、false // 所有下标大于1的多选框选中 // $('input:gt(1)').addClass('hei') removeClass // 给指定的节点移除指定的节点class名 bai $('#lala').

横向显示(css)

横向显示(css) 1.效果 demo.png 2.html JS Bin 姓名 姓名 姓名 姓名 姓名 姓名 3.css ul{ border:1px solid blue; list-style:none; } ul li{ float: left; border:1px red solid;clearfix::after{ content:''; display: block;

给页面对应的导航添加样式

给页面对应的导航添加样式 在做动态页面的时候,导航部分是公用的,很难直接用样式给页面对应的导航按钮添加不一样的样式,现在就使用js方法: //获取当前页面的链接 var currentUrl = window.location.href;navbar-nav":是ul的class, $('.find('li').children("a").attr(("href")); //var obur = currentUrl.indexOf(objUrl, 20); //console.log(obur);attr("class", "nav-active");

jq 给垂直导航菜单对应的父级添加class,展开样式

jq 给垂直导航菜单对应的父级添加class,展开样式 html: 左边的导航: 右边内容: js: var viewTitle = $(".view-title").layui-colla-content').find('li').children("a"). //获取遍历li里面的a标签内容 //console.log(objUrl); if (viewTitle.indexOf(objUrl) = 0) { //使用右边内容标题使用 indexOf() 在字符串内进行检索,跟左边导航的a标签里面是否大于等于0 $(this).addClass("layui-show");//给对应的父级添加对应的class名字 } })

鼠标经过时边框样式左上角右上角动画

鼠标经过时边框样式左上角右上角动画 html: css: .industry . width: 270px; z-index: 99; top: 0px;stry-bottom { position: absolute; right: 0px;stry-left { height: 0;industryList li").mouseenter(function () { $(this).animate({ "width": "100%", }, 500).css("background", "#ff0000");children("div:odd").mouseleave(function () { $(this).

For循环中的异步问题(JS)

For循环中的异步问题(JS) for循环内外的变量值 先看一段代码 for(var i=0;JS var oli = document.querySelectorAll("li");i oli.length;onclick = function () { this.style.backgroundColor = "red"; 使用this 这里的this是指向了当前的元素本身,即一个对象,而不是指向当前函数。

作用域插槽

作用域插槽 插槽 var child = { data : function(){ return { lists : [1,2,3,4,5,6] } }, template : ` {{item}} ` } var vm = new Vue({ el : "#app", components : { child : child } }) {{props.item}} var child = { data : function(){ return { lists : [1,2,3,4,5,6] } }, template : ` ` } var vm = new Vue({ el : "#app", components : { child : child } })

制作淘宝导航栏

制作淘宝导航栏 image.png 我要做的是一个淘宝的导航栏,图片中画圈的部分,实现起来不是很难。 Document *{ margin: 0; } ul,li{ list-style:none;/* 设置默认超链接样式为白色*/ text-decoration:none;/* 清除默认样式*/ } li{ margin:0 10px; /* 左浮动*/ line-height:30px; /* 行高设置*/ font-weight:700;/* 设置文字大小*/ color:#fff; } #banner{ background-color:#ff9000; /* 设置div宽高背景色*/ width:1342px;

H5自定义属性

H5自定义属性 自定义属性 1.自定义属性 data-开头 后面跟上属性名称 data-user = user data-user-age = userAge 浏览器会自动解析 3.要遵循驼峰命名 element.dataset获取自定义属性的集合 5.设置属性 element.setAttribute("data-age","15"); 6.获取属性 element.getAttribute("data-age") 自定义属性 //获取到 var list = document.getElementById("list"); //添加事件 li.addEventListener("click",function () { console.log(this.dataset);

用闭包写一个Tab选项卡,为什么要用闭包以及闭包造成内存泄露

用闭包写一个Tab选项卡,为什么要用闭包以及闭包造成内存泄露 直接上代码吧! Title *{margin: 0;box{width: 500px;height: 200px;} #tab{width: 498px;height: 48px;} #tab li{font-size: 16px;line-height: 50px;height: 150px;background: burlywood;} #content div{display: none;active{background: #47c1f7;font-size: 22px; var li = tab.getElementsByTagName('li'); var content = document.getElementById('content'); var div = content.getElementsByTagName('div');

利用BeautifulSoup爬去我爱我家的租房数据

text price = div1.find_all("div",{"class":"jia"})[0].p.strong.string for uldiv in detail.find_all("div",{"id":"housebroker"}): for ul in uldiv.find_all("ul"): lxrphone = ul.h3.string+ul.label.string sql = "insert into zufang(area,xiaoqu,community,hot,price,lxrphone) VALUES ('%s','%s','%s','%s','%s','%s');"

闭包使用的3种情景

闭包使用的3种情景 定义:通俗讲,闭包是函数里面再定义一个函数,里层函数能访问到外层函数的布局变量,也就是说闭包是一个能访问外层函数布局变量的函数。常用情景有以下3种。 1.在window下有个全局变量a

html之列表

html之列表 列表 无序列表 无序列表:用来表示一个列表的语义,并且每一个项目和项目之间是不分先后的 ul: unordered list 无序列表 li: list item 列表项 无序列表是一组标签 li 标签是容器级标签,可以嵌套任何标签 中国的城市 北京 上海 深圳 广州 郑州 ul的作用,并不是给文字增加小圆点的,而是增加无序列表的“语义”的 无序列表.

元素的显示方式

元素的显示方式 timg.jpg 元素的分类 块级元素 特点:单独占一行,可以给这个元素设置宽高 显示方式(display):block 所属的标签有:div,p,h,ul,lo,ol,dl 行内元素 特点:可以多个标签放在一行,但是给标签设置宽高没有作用 显示方式(display):inline 所属的标签有:span,b,u,i,ins,strong