-
CSS实现网页背景图片自适应全屏的方法
所属栏目:[教程] 日期:2020-05-13 热度:125
网页背景自适应全屏.PNG 一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形的背景大图,而[详细]
-
CSS :befor :after 伪元素的巧妙用法
所属栏目:[教程] 日期:2020-05-13 热度:172
CSS中的:befor、:after都会创建一个伪元素,其中:befor创建的伪元素是所选元素的第一个子元素,:after创建的伪元素是所选元素的最后一个子元素。 :befor、:after创建的伪元素默认样式为内联样式。 1.2 语法 /* CSS3 */selector::before/* CSS2 */selector:[详细]
-
stricky footer的三种解决方案详解
所属栏目:[教程] 日期:2020-05-13 热度:79
stricky footer设计是最古老和最常见的效果之一,我们都曾经历过类似的情景: 如果页面内容不够长的时候,页脚块粘贴在底部;如果内容足够长时,页脚块会被内容向下推送。 这些天做vue+express实战的练习,跟着黄轶老师倒是认识了stricky footer,就认真的[详细]
-
CSS选择器的新用法(推荐)
所属栏目:[教程] 日期:2020-05-13 热度:64
现在,预处理器(如sass)似乎已经成为开发CSS的标配,正如几年前jQuery是开发JS的标配一样。JS的querySelector借鉴了jQuery的选择器思想,CSS选择器也借鉴了预处理器的变量定义、选择器嵌套、代码块重用等常用功能。本文将详细介绍CSS选择器的新用法 变量[详细]
-
css3动画过渡实现鼠标跟随导航效果
所属栏目:[教程] 日期:2020-05-13 热度:81
本篇文章主要介绍了css3动画过渡实现鼠标跟随导航效果,分享给大家,具体如下: 鼠标跟随导航效果 效果知识点:html/css布局思维, div+css讲解,css3动画,盒子模型, 浮动与定位,鼠标事件。 html代码: div class=wrapulli style=background-position:0px[详细]
-
10分钟理解CSS BFC原理及其应用
所属栏目:[教程] 日期:2020-05-13 热度:96
在讲 BFC 之前,我们先来了解一下常见的定位方案,定位方案是控制元素的布局,有三种常见方案: 普通流 (normal flow) 在普通流中,元素按照其在 HTML 中的先后位置至上而下布局,在这个过程中,行内元素水平排列,直到当行被占满然后换行,块级元素则会被[详细]
-
css3实现波纹特效、H5实现动态波浪效果
所属栏目:[教程] 日期:2020-05-13 热度:173
css3实现动态波纹特效,由于css3里面有过渡和动画效果,现在利用css3实现动态波浪效果就很简单了,直接使用transform来实现就ok, 使得translateX 产生偏移就可以不断实现循环动态效果,这样就比传统的flash来实现更为简单。而且对页面也比较友好的。 比如[详细]
-
CSS实现多行多列的布局的实例代码
所属栏目:[教程] 日期:2020-05-13 热度:148
副标题#e# HTML: div class=box1box1:实现两列多行布局ulli111/lili222/lili333/li/ul/div CSS: .box1 { width: 500px; background: #EEEEEE;}.box1 ul { clear: both; overflow: hidden;}.box1 ul li { width: 48%; height: 100px; margin-bottom: 10px; b[详细]
-
Jar包一键重启的Shell脚本及新服务器部署的一些经验分享
所属栏目:[教程] 日期:2020-05-13 热度:103
最近公司为客户重新部署了一套新环境,由我来完成了基础环境的配置,配置过程中总结了一些经验,分享给各位园友 使用 curl 命令检查网络 拿到新服务器后,首先检查服务器网络是否通畅。我们常用的 ping 命令使用的是 ICMP 协议,大部分服务器都设置了域名[详细]
-
完全卸载VSCode--解决卸载重新安装后还有原来配置的问题(图解)
所属栏目:[教程] 日期:2020-05-13 热度:190
VSCode卸载后进行重新安装,发现新安装的还有原来的一些配置,卸载的不彻底,有时候也容易出问题,可按照如下方法卸载干净: 1.进入控制面板卸载VSCode,也可以在VSCode的安装目录下用程序自带的卸载程序(这个没有亲自试过.....) 2.这样卸载完后还有一些[详细]
-
详解Idea 2020 找不到或无法安装官方汉化包解决方案
所属栏目:[教程] 日期:2020-05-13 热度:105
Idea 2020 发布之后,官方终于支持了中文语言包 但是,我下载后在插件市场无法找到官方的汉化包 那要怎么解决这个问题呢? 首先,查看你当前Idea的Bulid版本 然后去官网下载离线汉化语言包,下载链接 可以看到一堆的版本号,这里要注意下,目前官方的最新[详细]
-
IntelliJ IDEA 2020如何设置背景图片的方法步骤
所属栏目:[教程] 日期:2020-05-13 热度:134
使用idea总看小黑框很难受?眼睛疼?看不清?试试按照你的风格来定制一哈! 1.首先我们选择idea的最左上角的file 2.选择settings 3.找到AppearanceBehavior 4.点击Appearance 5.选择Background Image 之后会就可以开始设置背景图片啦O(∩_∩)O 具体的设置[详细]
-
十步搞定uni-app使用字体图标的方法
所属栏目:[教程] 日期:2020-05-13 热度:186
uni-app是一个使用Vue.js开发跨平台应用的前端框架,开发者编写一套代码,可编译到iOS、Android、H5、小程序等多个平台。 uni-app框架由Dcloud即数字天堂(北京)网络技术有限公司推出,该公司主要产品有Web开发IDE Hbuiler、HbuilderX,前端框架mui、uni-ap[详细]
-
IntelliJ IDEA2020新增禅模式和LightEdit模式
所属栏目:[教程] 日期:2020-05-13 热度:191
IntelliJ IDEA 2020.1 的第二个早期访问版本已发布,新的 EAP 构建对调试器和事件探查器(Profiler)进行了改进,并引入了新的提交工具窗口(Commit toolwindow)以及禅模式(Zen Mode)。 用于调试器的数据流分析协助功能 IntelliJ IDEA 2020.1 向调试器[详细]
-
详解VScode 配置为 LaTeX 编辑器(IDE)
所属栏目:[教程] 日期:2020-05-13 热度:155
副标题#e# ctrl+shift+x调出应用商店,搜索并安装LaTeX Workshop扩展: 配置LaTeX Workshop LaTeX文件.tex的编译、预览、辅助文件的清理等都在扩展latex workshop中设置。 LaTeX Workshop中,编译LaTeX文件时顺序执行的一系列/组命令称为LaTeX食谱(recipes)[详细]
-
人工智能机器学习常用算法总结及各个常用算法精确率对比
所属栏目:[教程] 日期:2020-05-13 热度:94
副标题#e# 机器学习的知识树,这个图片是Github上的,有兴趣的可以自己去看一下: 地址:https://github.com/trekhleb/homemade-machine-learning 简单的翻译一下这个树: 英文中文 Machine Learning 机器学习 Supervised Learning 监督学习 Unsupervised L[详细]
-
ASCII码对照表以及各个字符的解释(精华版)
所属栏目:[教程] 日期:2020-05-13 热度:197
副标题#e# ASCII(American Standard Code for Information Interchange,美国信息互换标准代码)是一套基于拉丁字母的字符编码,共收录了 128 个字符,用一个字节就可以存储,它等同于国际标准 ISO/IEC 646。 ASCII 规范于 1967 年第一次发布,最后一次更[详细]
-
VSCode提高 Node 和 Vue 开发效率的插件推荐
所属栏目:[教程] 日期:2020-05-13 热度:113
HTML5、CSS3、SVG的浏览器兼容性检查 运行选中代码段(支持大量语言,包括Node) 在VSCode中弹出浏览器并搜索,可编辑搜索引擎 颜色值在代码中高亮显示 拾色器 注释文档生成 EditorConfig 插件 在代码中输入emoji ESLint插件,高亮提示 根据路径字符串,快[详细]
-
CSS3 clip-path 用法介绍详解
所属栏目:[教程] 日期:2020-05-13 热度:136
刷新 QQ 空间动态时,发现一则广告,随着用户上下滑动动态列表,就会自动切换广告图片,这样的效果对移动端本就不大的屏幕来说,无疑是很精妙的考虑,这样的效果是怎么实现的呢? 接下来就说说这个效果的具体实现思路: 将两张图片通过定位,相对于图片容[详细]
-
css常用元素水平垂直居中方案
所属栏目:[教程] 日期:2020-05-13 热度:131
flex实现水平垂直居中 适用场景:父子宽高都可未知(比较推荐这种方式,简单,而且目前兼容性也不错。) html headstyle.parent {width: 100%;height: 100px;background: cyan;display: flex;justify-content: center;align-items: center;}.son {width: 20%[详细]
-
深入理解CSS中的line-height的使用
所属栏目:[教程] 日期:2020-05-13 热度:181
什么是line-height(行高)? line-height 是指两行文字基线之间的距离。 什么是基线? 基线、底线、顶线、中线 注意: 基线(base line)并不是汉字文字的下端沿,而是英文字母x的下端沿。 不同字体的基线不尽相同。 行距、行高 line-height 与行内框盒子模[详细]
-
CSS实现镂空遮罩效果
所属栏目:[教程] 日期:2020-05-13 热度:184
前一阵子面试被问题到这个问题,突然懵逼了,脑子一片空白,以前知道这种效果,比如什么值得买的改版引导页面: 当时再紧张也应该打出一种实现方法,就是什么值得买这种使用图片实现 它首先加了一个半透明的黑色蒙层( background-color: rgba(0,0,0,.8)[详细]
-
详解flex布局的元素如何分配容器的剩余空间
所属栏目:[教程] 日期:2020-05-13 热度:75
副标题#e# 自从开始开学习 CSS 布局,想要比较灵活的把父元素的空间分配给各个子元一直是各个前端程序员的梦想。 在 flex 之前,如果不是专门去搜索相关的解决方案,一般人几乎想不出非常灵活的三(多)栏等高布局方案,而即使看了解决方案,很多人也会大呼[详细]
-
CSS3 translate导致字体模糊的实例代码
所属栏目:[教程] 日期:2020-05-13 热度:152
今日客户反馈,发现 使用了 translate会导致字体模糊。 .media-body-box{@media all and (min-width: 992px){position: absolute;width: 100%;top:50%;transform: translateY(-50%);right: 0;padding: 30px;}} 为了垂直居中,使用了 transform: translateY[详细]
-
CSS中@support实现渐进式网页设计实例代码
所属栏目:[教程] 日期:2020-05-13 热度:53
特性查询赋予了我们使用CSS检测浏览器是否支持某个css特性的能力。我们可以使用该功能在浏览器支持最新的CSS特性时,使用新的语法来编写我们的样式,同时对于不支持的浏览器进行优雅降级。 CSS的设计本身就是支持优雅降级的。对于浏览器不支持的CSS语法,[详细]
