编程开发 - 教程之家

195浏览

0评论

解决搜索框和搜索按钮button边框不能重合的问题

今天在用百度页面做练习的时候突然发现，尽管设置了搜索框和button的margin值和padding值各为0，他们俩的边框还是不能重合（不想用position）无奈之下问了老师，老师说设置他俩的父元...

2020-11-26 22:48:48

177浏览

0评论

css一些不常见但很有用的属性操作大全

1、自定义文本选择::selection { background: red; color: black;}2、去掉video的controls中的下载按钮video::-internal-media-controls-download-button { display:n...

2020-11-26 22:48:47

211浏览

0评论

CSS中width和height的默认值auto与%案例详解

结论 width的%：定义基于包含块（父元素）宽度的百分比宽度，会突破父级的限制 width的auto：尽量被父级包裹 height的%：基于包含它的块级对象的百分比高度，会突破父级的限制...

2020-11-26 22:48:45

194浏览

0评论

css实现鼠标放上去时图片过渡转换动画效果

代码<div class="test"> <div></div> <div></div> </div> .test{ width: 200px; height: 200px; margin-top: 200px; margin-left: 300px; overflow: hidden...

2020-11-26 22:48:44

178浏览

0评论

详解CSS标签模式display属性

代码如下所示：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <...

2020-11-26 22:48:43

234浏览

0评论

css为什么要放在head标签中

思考: css为什么要放在head标签中, 而不能像javascript一样置于body标签尾部?Talk is cheap, show me the code.OK, 那我们通过写一些代码来得出结果在这里先说chrome控制台...

2020-11-26 22:48:41

245浏览

0评论

CSS实现两个元素相融效果(粘滞效果)

记得前几年手机版淘宝左下角有个狠有意思的圆形按钮，点击后会出现几个小按钮，并且出场动画很有意思，后面才知道这种效果叫“粘滞”效果，如图：
那这种效果到底用了什么...

2020-11-26 22:48:39

259浏览

0评论

纯 CSS 实现点击展开阅读全文功能

记要开发文章展示列表界面时, 想通过展示部分文章头内容达到基本信息概览的需求即可, 并展示【点击展开阅读全文】的按钮以获取详情内容。参考了文章 caibaojian.com/css-...

2020-11-26 22:48:37

231浏览

0评论

详解CSS边距重叠与解决方案探究

最近复习了一下CSS相关的知识点，对于CSS中经典的边距重叠问题进行了梳理总结，目的是检验复习效果，也希望对他人有所帮助，疏漏之处还请各位前端老鸟们不吝赐教。提出问题：在使用CS...

2020-11-26 22:48:36

247浏览

0评论

CSS3实现左上角或右上角显示提醒圆点的示例代码

效果图（如果想要三角形请点击这里）：代码： <html><head> <style type="text/css"> .message_s { position: relative; cursor: pointer;...

2020-11-26 22:48:34

213浏览

0评论

使用CSS伪元素控制连续几个元素的样式方法

用CSS伪元素控制元素的时候经常性的需要改变一些元素的样式，网上有许多博客都说了如何去控制一个的改变，但是我在实际写的过程中，发现更多时候是需要控制多个连续元素的改变。...

2020-11-26 22:48:33

113浏览

0评论

编程式处理Css样式的示例代码

编程式方法的好处 1.全局控制，避免样式散乱2.代码简洁，开发快速函数式编程大量使用函数，减少了代码的重复，因此程序比较短，开发速度较快3.接近自然语言，易于理解函数式编程的自...

2020-11-26 22:48:32

265浏览

0评论

css实现文字在背景图片之上

效果：<div class="imgs">  <div class="background"> <img :src="item.voteTime ? imgSrc1:imgSrc2" width="100%" height="100%" alt="" /> </div> <...

2020-11-26 22:48:30

191浏览

0评论

Chrome的最小字体12px限制最终解决办法

相信不少做网站的用户会有这样一个问题，Chrome 默认最小字体是12px（最新版英文也有此问题），这个是 Chrome 为了更好显示中文设计的，但是这样一来就会出现某些上标、下标字体过大，...

2020-11-26 22:48:29

394浏览

0评论

CSS将img图片填满父容器div并自适应容器大小

当一个页面中引入多张图片时候，会碰到图片尺寸不一致，单要求显示成一致的大小，我们直接设置图片尺寸会导致图片变形，这就是我们遇到的问题，看下解决方法<div> <img src="...

2020-11-26 22:48:27

232浏览

0评论

button内flex垂直居中竟然不居中的解决

问题描述按钮样式为图标+文字，在使用flex布局写垂直居中时，iphone7手机上文字和图标却没有居中，居左显示。代码如下（已精简）：<button> <img src="./refresh.png" alt /> {{ conf...

2020-11-26 22:48:26

159浏览

0评论

详解常用css样式(布局)

兼容css3新属性在css3中，我们可以使用prefixfree.min.js这个插件来自动为css3的相关属性加上兼容浏览器属性，使我们不用为每个css3新属性再加上属性（需要用到大量css3的项目时...

2020-11-26 22:48:24

186浏览

0评论

如何使用css实现数据热点效果

效果如下：分析1.这里看到的大概有三个圈围着点在做放大动画所以我们写四个盒子点+3个圈<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name=...

2020-11-26 22:48:20

276浏览

0评论

CSS实现鼠标滑过卡片上浮效果的示例

原理hover 的时候对元素设置阴影：box-shadow，使其样式与常态不同。box-shadow 表达式参见 MDN：/* x偏移量 | y偏移量 | 阴影颜色 */box-shadow: 60px -16px teal;/* x偏移量 |...

2020-11-26 22:48:18

94浏览

0评论

CSS常用的封装方法汇总

1. pc-reset PC样式初始化/* normalize.css */html { line-height: 1.15; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */}b...

2020-11-26 22:48:15

215浏览

0评论

css实现隐藏滚动条并可以滚动内容的实例代码

前言当页面的html结构嵌套的盒子很多的时候，可能会导致一个页面中含有多个垂直滚动条。
这样的话很影响页面的样式，所以我们需要隐藏滚动条的同时还支持滚动，下面就是利用css实...

2020-11-26 22:48:14

208浏览

0评论

CSS伪类:empty让我眼前一亮(实例代码)

最近看过我文章的都知道：我最近在负责一个微信小程序的项目，在其中遇到了很多有趣的事和一些“奇思妙想”。本文的背景就是某天早上我看着wxml文件中一堆wx:if/else...

2020-11-26 22:48:13

227浏览

0评论

css利用负margin实现平均布局的示例

对于平均分布的布局，我们一般使用负margin的方法。如下图，就是平均布局。一般这种情况，我们都是在父元素和子元素之间加上一层div，然后，给这个div设置负margin-right，值为两个子元...

2020-11-26 22:48:11

131浏览

0评论

纯css3实现横向无限滚动的示例代码

本文示例都是用小程序写的，但是不影响要实现的功能。wxml装图片的盒子多复制一份，让循环图片的首尾相接<view class="scrollbox dis-flex"> <view class="imgItem dis-flex...

2020-11-26 22:48:10

213浏览

0评论

css之Display、Visibility、Opacity、rgba和z-index: -1的区别

我们在网页中经常需要控制一些元素的隐藏、透明等属性<style> .d1{ display: none; } .d2{ visibility: visible; } .d3{ opacity: 0; }...

2020-11-26 22:48:09

136浏览

0评论

CSS线性渐变的凹面矩形过渡动效的实现

本文聊一聊线性渐变的凹面矩形过渡动效的难点和思路，主要介绍凹面矩形实现、给凹面矩形加线性渐变、线性渐变背景色的过渡。如果有更好的实现方案，欢迎在评论区和我讨论。上图...

2020-11-26 22:48:08

219浏览

0评论

CSS实现表格首行首列固定和自适应窗口的实例代码

今天校招笔试题要求实现一个首行首列固定，宽度自适应窗口变化，但窗口缩小到一定宽度不能再缩小，出现水平滚动条…
当时我写错了，我一时想不起改用什么办法首行首列固定，用...

2020-11-26 22:48:05

175浏览

0评论

纯 CSS 实现蜡烛融化(水滴)的示例代码

实现效果实现思路融化效果是利用 filfilter 的 contrast 和 blur 实现的。
在父元素中设置 contrast 并在子元素中设置 blur 即可实现两者相融的效果。代码<!DOCTYPE html><...

2020-11-26 22:47:59

180浏览

0评论

使用CSS实现盒子水平垂直居中的方法(8种)

原始代码：center.html：<!DOCTYPE html><html lang="Zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">...

2020-11-26 22:47:58

168浏览

0评论

CSS清楚浮动clear:both的实例代码

今天给大家讲一下清楚浮动，在讲清除浮动前，需要了解什么是浮动，这里我就不给你大家详细介绍浮动了。
浮动也就是脱离文档流，脱离文档流了，那父级的宽高就不能被子集撑开，所以我们...

2020-11-26 22:47:56

154浏览

0评论

浅谈缩减SCSS 50%样式代码的14条实战经验

前言Sass是CSS3语言的扩展，它能帮你更省事地写出更好的样式表，使你摆脱重复劳动，使工作更有创造性。因为你能更快地拥抱变化，你也将敢于在设计上创新。你写出的样式表能够自如地...

2020-11-26 22:47:55

279浏览

0评论

css属性width默认值width: auto与width: 100%区别详解

width: auto 子元素（包括content+padding+border+margin）撑满整个父元素的content区域。子元素有margin、border、padding时，会减去子元素content区域相对应的width值...

2020-11-26 22:47:53

313浏览

0评论

详解在table设置max-width以及min-width兼容问题和解决方案

在table中设置min-width和max-width属性<table> <tr><td>1</td><td>2</td></tr></table>table{min-width:60%;min-width:100%;}但是chrome不兼容max-width，ie7两者都不兼容。...

2020-11-26 22:47:51

205浏览

0评论

Blazor中的CSS隔离问题

1.环境VS 2019 16.9.0 Preview 1.0.NET SDK 5.0.1002.前言CSS一旦生效，就会应用于全局，所以很容易出现冲突。为了解决这个问题CSS隔离就顺势而生。Blazor诞生于2018年，至今为止...

2020-11-26 22:47:50

223浏览

0评论

overflow:auto的用法详解

在开始正文前，我介绍一下overflow和flex布局的某些用法。
overflow：auto；如果内容被修剪，则浏览器会显示滚动条，以便查看其余内容。
flex中的属性
display: flex;
flex-direc...

2020-11-26 22:47:47

167浏览

0评论

Typora代码块配色和标题自带序号的实现代码

效果：标题自带序号，代码块配色，代码块左上角仿mac图标先打开主题文件夹文件>偏好设置>外观>打开主题文件夹然后编辑base.user.css（如果没有就新建一个）文件将以下代码加入即可/*...

2020-11-26 22:47:45

178浏览

0评论

Canvas实现放大镜效果完整案例分析(附代码)

本文主要记录 canvas 在图像、文字处理、离屏技术和放大镜特效的实现过程中使用到的API。先看下效果吧：

一张模糊的图片：

鼠标点击任意位置，产生放大效果：

...

2020-11-26 22:38:50

214浏览

0评论

CSS实现宽度自适应宽高16:9的矩形的示例

前面我们讲了怎么做一个自适应宽高1:1的正方形

https://www.freexyz.cn/css/753385.html

现在我们来讲讲做自适应16:9的矩形要怎么做

第一步先计算高度，假设宽100%，...

2020-11-26 22:38:29

178浏览

0评论

python分布式爬虫中消息队列知识点详解

当排队等待人数过多的时候，我们需要设置一个等待区防止秩序混乱，同时再有新来的想要排队也可以呆在这个地方。那么在python分布式爬虫中，消息队列就相当于这样的一个区域，爬虫...

2020-11-26 22:34:36

180浏览

0评论

python爬虫分布式获取数据的实例方法

在我们进行卫生大扫除的时候，因为工作任务较多，所以我们会进行分工，每个人负责不同的打扫项目。同样分工合作的理念，在python分布式爬虫中也得到了应用。我们需要给不同的爬虫...

2020-11-26 22:34:12

121浏览

0评论

Spring MVC创建项目踩过的bug

前言

最近在学spring MVC，做为一个初学者，踩了不少坑，导致项目各种出错

在这里向大家分享一下我的项目开发操作，开发springMVC项目步骤:

打开idea

我的项目运行环境

在...

2020-11-26 22:32:57

230浏览

0评论

Android自定义view实现拖动小球移动

Android应用界面中可以看得见的都是由一个个的View所组成的，几乎所有的可视的控件都是基于View写的。在View中提供了对touch也就是手势的捕获和传递，我们可以对View里面手势...

2020-11-26 22:32:31

189浏览

0评论

Django filter动态过滤与排序实现过程解析

前期准备

在虚拟开发环境中安装：

pip install django-filter

在Django的项目配置文件中安装并配置django_filters应用：

INSTALLED_APPS = [ ... 'django_filter...

2020-11-26 22:30:44

143浏览

0评论

Python批量修改xml的坐标值全部转为整数的实例代码

发现一个有意思的现象，labelimg打开图片和xml标签时候，看不到标注好的框框，仔细查看了xml文件，没发现什么异常，后面试一下，才发现是不能识别xml里的坐标值有小数点的情况。只能...

2020-11-26 22:30:32

133浏览

0评论

python模拟点击玩游戏的实例讲解

小编发现很多小伙伴都喜欢玩一些游戏，而手游因为玩的场景限制不多，所以受众的人更多。游戏里有很多重复的任务需要我们完成，虽然过程非常无聊，但是为了任务奖励还是有很多小伙...

2020-11-26 22:30:18

153浏览

0评论

python Xpath语法的使用

一、XMl简介

（一）什么是 XML

XML 指可扩展标记语言(EXtensible)

XML 是一种标记语言，很类似 HTML。

XML 的设计宗旨是传输数据，而非显示数据。

XML 的标签需要我们...

2020-11-26 22:30:07

97浏览

0评论

Django多个app urls配置代码实例

快速测试创建项目与app

django-admin startproject mysite

django-admin startapp app1

django-admin startapp app2

mysite下的urls.py文件

from djan...

2020-11-26 22:29:51

198浏览

0评论

python输出国际象棋棋盘的实例分享

国际象棋是当今国际上最流行的智力体育运动项目。青年人下棋可以锻炼思维、增强记忆力和培养坚强的意志；中年人下棋可以享受美学；老年下棋可以很好的休息娱乐。国际象棋游戏...

2020-11-26 22:29:35

143浏览

0评论

详解使用 JavaScript 解析 URL的方法

在 Web 开发中，有许多情况需要解析 URL，这篇主要学习如何使用 URL 对象实现这一点。开始创建一个以下内容的 HTML 文件，并在浏览器中打开。<html> <head> <title>Jav...

2020-11-26 19:31:56

145浏览

0评论

详解jQuery中extend()和jQuery.fn.extend()的区别

1、认识jQuery extend()和jQuery.fn.extend()jQuery的API手册中，extend方法挂载在jQuery和jQuery.fn两个不同对象上方法，但在jQuery内部代码实现的是相同的，只是功能却不太一样...

2020-11-26 19:31:23

热门文章