编程开发 - 教程之家

223浏览

0评论

CSS+JS实现水滴涟漪动画按钮效果的示例代码

代码如下所示：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>...

2020-10-15 23:12:01

245浏览

0评论

CSS 中的六个重要选择器(三秒就可以记住)

来自：https://blog.csdn.net/qq_44761243/article/details/108227213CSS 的选择器有哪些？？？1.通配符（*）也可称作全局选择器或者通用选择器，顾名思义，就是定义所有的元素的样式。常用...

2020-10-15 23:11:59

155浏览

0评论

详解css3中dispaly的Grid布局与Flex布局

Gird布局与Flex布局有一定的相似性，都是对容器的内部项目进行划分。 Flex布局是轴线布局，只能指定项目针对轴线的位置，可以看作成一维布局 Grid布局则是将容器划分成行和...

2020-10-15 23:11:51

215浏览

0评论

CSS中三角形的绘制与巧妙应用实例详解

引网页中常见的一些三角形，无需制作成图片或者字体图标，使用CSS就可以直接画出来。如小米官网中：以及京东网页中的：那么这些三角通过是CSS怎么实现的呢？三角的实现我们可以通过将...

2020-10-15 23:11:34

367浏览

0评论

纯css实现轮播图banner自动轮换效果

话不多说直接上代码* { margin: 0; padding: 0; } .container { margin:300px auto; height: 400px;...

2020-10-15 23:11:25

182浏览

0评论

让我来教你使用css中的字体图标的方法

首先什么是字体图标呢，那就是表面上是图标，其实它是文字，我们可以就像设置文字一样去设置字体图标，一般可以使用两种方式去设置字体图标，一种是引入css文件，然后设置特殊的class就...

2020-10-15 23:11:24

140浏览

0评论

CSS 首行缩进两个文字

总是在前面加上8个“ ”，因为过去大家对CSS的概念也不太熟悉，也不太重视，这种方法实现虽然比较直接，但是文字多的时候会有很多“ ”充斥在代码中，如果再...

2020-10-15 23:11:19

249浏览

0评论

css 中的background:transparent到底是什么意思有什么作用

有时我在看css时,看到有的css属性定义为background:transparent。意思就是背景透明。实际上background默认的颜色就是透明的属性。所以写和不写都是一样的

有段时间没写文...

2020-10-15 23:11:17

234浏览

0评论

CSS圆角效果 -webkit-border-radius(CSS3中border-radius隐藏的威力)

-webkit-border-radius：苹果；谷歌，等一些浏览器认，因为他们都用的是webkit内核；
-moz-border-radius：moz这个属性主要是专门支持Mozilla Firefox 火狐浏览器的CSS属性。
在这两...

2020-10-15 23:11:16

154浏览

0评论

CSS自定义select下拉选择框的样式(不用其他标签模拟)

今天群里有人问到怎么自定义select下拉选择框的样式，于是群里就展开了激烈的讨论，刚开始一直就是考虑怎样使用纯CSS实现，把浏览器默认的样式覆盖掉，但最后均因兼容问题处理不...

2020-10-15 23:11:14

184浏览

0评论

CSS 文本字体颜色设置方法(CSS color)

一、认识CSS 颜色（CSS color）这里要介绍的是网页设置颜色包含有哪些；网页颜色规定规范。1、常用颜色地方包含：字体颜色、超链接颜色、网页背景颜色、边框颜色
2、颜色规范与颜色...

2020-10-15 23:10:58

252浏览

0评论

css设置各种中文字体如雅黑、黑体、宋体、楷体等等

复制代码代码如下:
.selector{ font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu }

说明：

加上中文名“微软雅黑”是...

2020-10-15 23:10:56

205浏览

0评论

HTML设置超链接字体颜色和点击后的字体颜色

定义链接样式
　　CSS为一些特殊效果准备了特定的工具，我们称之为“伪类”。其中有几项是我们经常用到的，下面我们就详细介绍一下经常用于定义链接样式的四个伪类，...

2020-10-15 23:10:54

114浏览

0评论

css控制UL LI 的样式详解(推荐)

复制代码代码如下:
<div id="menu">
<ul>
<li><a href="#">首页</a></li>
<li class="menuDiv"></li>
<li><a href="#">博客</a></li>
<li class="...

2020-10-15 23:10:53

266浏览

0评论

CSS 实现内容高度不够的时候底部(footer)自动贴底

在 UI 切图过程中，页面往往由三个部分组成，头部、内容和底部。当页面的内容高度不够撑满屏幕，底部（footer）就跟着内容浮动上来了，小屏幕由于高度有限看不出来异常，但如果是大屏的话...

2020-10-15 23:10:51

213浏览

0评论

详解浮动元素引起的问题和解决办法

一、问题多个浮动的元素无法撑开父元素的宽度，父元素的高度可能会变成0。若浮动元素后面跟非浮动元素，非浮动元素会紧随其后浮动起来。若浮动元素前面还有同级元...

2020-10-15 23:10:50

389浏览

0评论

CSS3动画和HTML5新特性详解

一、css3动画☺css3动画相对于通过JavaScript动态改变元素样式性能更好，更加容易。CSS3中有三个关于动画的属性：transform、transition和animation。
1、transform
trans...

2020-10-15 23:10:49

330浏览

0评论

CSS常用样式之绘制双箭头的示例代码

一、多次调用单箭头实现了单箭头–就很容易实现双箭头了，上文已经介绍2种实现单箭头的原理：边框旋转方式、双三角覆盖方式。这次以边框旋转为例多次调用实现双箭头。
1...

2020-10-15 23:10:48

188浏览

0评论

CSS中flex和inline-flex的区别详解

inline-flex 和 inline-block 一样，对内部元素来说是个 display:flex 的容器，对外部元素来说是个 inline 的块。两者的区别描述： flex：将对象作为弹性伸缩盒显示 inline-...

2020-10-15 23:10:46

207浏览

0评论

详解CSS布局中浮动问题的四种解决方案

一、起因：子盒子设置浮动之后效果：由此可见，蓝色的盒子设置浮动之后，因为脱离了标准文档流，它撑不起父盒子的高度，导致父盒子高度塌陷。如果网页中出现了这种问题，会导致我们整个...

2020-10-15 23:10:45

208浏览

0评论

CSS解决inline-block的错位问题

废话不多说帖代码html部分<div class="positionleft">我是position方式的左边，占30%</div> <div class="positionright">我是position方式的右边，占70%</div>css部分...

2020-10-15 23:10:43

244浏览

0评论

利用纯css做一个下拉菜单功能的示例代码

导语：
这几天看面试题目的时候，经常能够看到用css去实现一个下拉菜单，但是我发现很多人却没能够做出来，最后只能勉强用js做出来。实话实说，我很震惊，这个功能实现起来很简单，甚至可...

2020-10-15 23:10:41

247浏览

0评论

浅谈CSS 伪元素&伪类的妙用

在一个网页中CSS占着非常重要的地位。近年来随着CSS的发展，伪元素/伪类也开始被大量应用：在性能愈加被看中的当下，处于文档流之外的CSS伪元素/伪类是当之无愧的“无冕之王...

2020-10-15 23:10:40

121浏览

0评论

CSS子元素选择父元素的实现

通常一个CSS选择器都是从上往下选择的，通过父元素选择子元素，那么能不能通过子元素选择父元素呢？<ul> <li> <a href="#" class="active">1</a> </li> <li>...

2020-10-15 23:10:29

215浏览

0评论

CSS 屏幕大小自适应的实现示例

要想实现css屏幕大小自适应，首先得引入 CSS3 @media 媒体查询器：media的使用和规则：　　①被链接文档将显示在什么设备上。　　②用于为不同的媒介类型规定不同的样式。语法： @m...

2020-10-15 23:10:28

212浏览

0评论

CSS中的translate(-50%,-50%)实现水平垂直居中效果

translate(-50%,-50%) 属性：
向上和左，移动自身长宽的 50%，使其居于中心位置。与使用margin实现居中不同的是，margin必须知道自身的宽高，而translate可以在不知道宽高的情况下进...

2020-10-15 23:10:27

309浏览

0评论

css实现网页右下角点赞小卡片效果（实例代码）

效果实现HTML先准备一个干净的 html 页面，写好节点：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wid...

2020-10-15 23:10:17

187浏览

0评论

CSS 选择所有子元素添加样式的方法

方法：以实际项目中less为例：.lk-toolbar { .el-input { width: 169px; margin-right: 10px; } > * { margin-bottom: 20px; }}上面代码成功...

2020-10-15 23:10:14

741浏览

0评论

CSS子元素跟父元素的高度一致的实现方法

绝对定位方法：（1）将父元素设置为相对定位，不写父元素的高度时，会随着左边的子元素高度变化而变化.parent { /*关键代码*/ position: relative; /*其他样式*/ width: 800px; colo...

2020-10-15 23:10:11

183浏览

0评论

css子元素相对父元素进行定位的实现

解决方案在父元素中加入position:relative;
子元素中加入position:absolute; right:20px;代码html结构<div id="div1"> <div id="div2"></div></div>css#div1{ width:500px;...

2020-10-15 23:10:09

303浏览

0评论

纯CSS让子元素突破父元素的宽度限制

在写样式中，我们可以经常看到这样的情况代码如下<div style="width: 300px;border: 4px solid #000;margin: 20px;padding: 2px;"> 父元素 <div style="border: 1px so...

2020-10-15 23:10:08

180浏览

0评论

CSS实现子元素div水平垂直居中的示例

div基本布局<div class="main"> <div class="center"></div> </div>css样式1. 配合定位与margin：auto父元素加相对定位，子元素加绝对定位 .main{ width: 300px; heig...

2020-10-15 23:10:07

502浏览

0评论

详解CSS 子元素相对于父元素固定定位解决方案

基本概念绝对定位(absolute)：设置为绝对定位的元素框从文档流完全删除，并相对于其包含块定位，包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的...

2020-10-15 23:10:06

313浏览

0评论

CSS 使用规则总结

一.缩写规则
关于边距 margin（4边）：
1px 2px 3px 4px (上、右、下、左)
1px 2px 3px （省略的左等于右）
1px 2px (省略的上等于下)
1px （四边都相同）
简化所有：
*/ body{margi...

2020-10-15 23:10:03

112浏览

0评论

node.js基于socket.io快速实现一个实时通讯应用

随着web技术的发展，使用场景和需求也越来越复杂，客户端不再满足于简单的请求得到状态的需求。实时通讯越来越多应用于各个领域。HTTP是最常用的客户端与服务端的通信技术，但是H...

2020-10-15 22:53:38

174浏览

0评论

Node.js API详解之 module模块用法实例分析

本文实例讲述了Node.js API详解之 module模块用法。分享给大家供大家参考，具体如下：Node.js API详解之 moduleNode.js 有一个简单的模块加载系统。在 Node.js 中，文件和模块是...

2020-10-15 22:44:27

180浏览

0评论

Node 模块原理与用法详解

本文实例讲述了Node 模块原理与用法。分享给大家供大家参考，具体如下：
简介V8引擎本身就是用于Chrome浏览器的JS解释部分，但是Ryan Dahl，把V8搬到服务器，用于做服务器的软件。
No...

2020-10-15 22:44:24

213浏览

0评论

Node Express用法详解【安装、使用、路由、中间件、模板引擎等】

本文实例讲述了Node Express用法。分享给大家供大家参考，具体如下：安装npm install --save express基本使用//引用expressvar express = require('express');//创建appvar app...

2020-10-15 22:44:23

171浏览

0评论

Node Mongoose用法详解【Mongoose使用、Schema、对象、model文档等】

本文实例讲述了Node Mongoose用法。分享给大家供大家参考，具体如下：Mongoose简介是一个将JavaScript对象与数据库产生关系的一个框架，Object related model。操作对象，就是操作...

2020-10-15 22:44:22

171浏览

0评论

Node.js API详解之 Error模块用法实例分析

本文实例讲述了Node.js API详解之 Error模块用法。分享给大家供大家参考，具体如下：Node.js API详解之 ErrorNode.js 中运行的应用程序一般会遇到以下四类错误：
1.标准的 JavaSc...

2020-10-15 22:44:21

245浏览

0评论

使用npm命令提示: 'npm' 不是内部或外部命令,也不是可运行的程序的处理方法

在安装nodejs时候，有时候我们会把它安装在d盘或别的盘时，经常会遇到npm环境变量没有配好，需要自己手动去配置。在安装完nodejs后输入node --version查看安装是否...

2020-10-15 22:44:19

98浏览

0评论

Node.js API详解之 dns模块用法实例分析

本文实例讲述了Node.js API详解之 dns模块用法。分享给大家供大家参考，具体如下：Node.js API详解之 dnsdns (域名服务器)模块包含两类函数：第一类函数，使用底层操作系统工具进行...

2020-10-15 22:44:17

145浏览

0评论

Node.js API详解之 net模块实例分析

本文实例讲述了Node.js API详解之 net模块。分享给大家供大家参考，具体如下：Node.js API详解之 netnet 模块提供了创建基于流的 TCP 或 IPC 服务器(net.createServer())和客户...

2020-10-15 22:44:16

161浏览

0评论

Nodejs实现WebSocket代码实例

一、环境配置
　　1.下载安装nodejs https://nodejs.org/en/download/　　2.安装完成后打开cmd命令，执行node --version,看看是否安装成功，如果提示没有此命令，去配置下环境变...

2020-10-15 22:44:15

71浏览

0评论

Sublime Text3 配置 NodeJs 环境的方法

前言大家都知道，Sublime Text 安装插件一般从 Package Control 中直接安装即可，当我安装 node js 插件时候，直接通过Package Control 安装，虽然插件安装成功了，但是找不到配置文...

2020-10-15 22:44:14

176浏览

0评论

Node.js API详解之 readline模块用法详解

本文实例讲述了Node.js API详解之 readline模块用法。分享给大家供大家参考，具体如下：Node.js API详解之 readlinereadline 模块提供了一个接口，用于从可读流（如 process.stdin）...

2020-10-15 22:44:13

341浏览

0评论

详解如何修改 node_modules 里的文件

前言
有时候使用npm上的包，发现有bug，我们知道如何修改，但是别人可能一时半会没法更新，或者是我们特殊需求，别人不愿意修改，这时候我们只能自己动手丰衣足食。那么我们应该如何修...

2020-10-15 22:44:10

107浏览

0评论

Node.js API详解之 repl模块用法实例分析

本文实例讲述了Node.js API详解之 repl模块用法。分享给大家供大家参考，具体如下：Node.js API详解之 replrepl（交互式解释器）模块提供了一种“读取-求值-输出”循环（REPL）的实现，...

2020-10-15 22:44:08

86浏览

0评论

使用Typescript和ES模块发布Node模块的方法

本文主要介绍了使用Typescript和ES模块发布Node模块的方法，分享给大家，具体如下：TypeScript已经成为一种非常流行的JavaScript语言，这是有原因的。它的类型系统和编译器能够在您...

2020-10-15 22:44:07

105浏览

0评论

详解Node.js使用token进行认证的简单示例

本文只介绍简单的应用，关于json web token的具体介绍以及原理请参考阮一峰老师的JSON Web Token 入门教程。使用的Node框架是koa2，前端发送ajax请求使用axios首先创建工程目录...

2020-10-15 22:44:03

热门文章