NengHong-CSDN博客

原创 JS 判断浏览器的版本

不考虑对 IE9 以下浏览器的判断 function myBrowser(){ var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 var browser='unknown'; if (userAgent.indexOf("IE")!=-1) { browser="IE"; }els...

2019-05-06 13:42:23 867

原创 HBuilder 中 LESS 自动编译为 CSS 的方法

之前介绍了webstorm 中 LESS 自动编译为 CSS 的两种方法，接下来介绍在 HBuilder 中 LESS 自动编译为 CSS 的方法。此方法也需要用到 node 环境通过 npm 工具包安装 less，命令行 npm install less -g；通过命令 lessc 测试less是否安装成功在 HBuilder 中打开 "工具" → "预编译器设置"，新建...

2019-05-06 11:33:08 1038

原创 webstorm 中 LESS 自动编译为 CSS 的两种方法

方法一通过 npm 工具包安装 less，命令行 npm install less -g；通过命令 lessc（配置环境变量 E:\npm）测试less是否安装成功在此之前需安装 nodejs ，查看nodejs和npm的版本，命令行如下： node -v npm -v 如何把less文件编译成css文件： a.命令行的方式 Lessc lnh.less > lnh.css b.在...

2019-05-06 11:18:22 5231 4

原创将 iframe 自动适应整个页面

通过 js 来控制 iframe 的高度，监听浏览器被重置大小时的 onresize 事件，对 iframe 的高度重新赋值。引入 jquery.min.js <!DOCTYPE html> <html> <head lang="en"> <meta charset="utf-8"> <meta http-equiv="X-U...

2019-05-06 09:36:19 3835

原创移动端轮播图，自动切换 - swiper插件

移动端轮播图使用的 swiper 插件，版本是 Swiper 4.5.0 首先引入 swiper.min.css 以及 swiper.min.js 在 html 中，搭好模板 <div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slid...

2019-05-05 17:07:11 1510

原创文字单行滚动DEMO

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;"> &lt...

2019-05-05 16:58:29 465

原创去除 input 默认样式

input { border: 0; } input:focus { outline: none; }

2019-05-05 16:39:45 1038

原创 flex 布局常用属性

针对个人使用弹性布局 display: flex; 的频繁属性进行总结： flex-direction - 主轴方向，默认是横向的 row，纵向为 column justify-content - 项目在主轴上的对齐方式，默认是 flex-start ，常用的 center 、space-between、space-around align-items - 项目在交叉轴上的对齐方式，默认是...

2019-05-05 16:36:20 416

原创 CSS 移动端导航固定于底部

html 如下： <div class="index">  <div class="g-main"> </div>  <div class="g-foot"> <div class="m-item"&...

2019-05-05 16:08:25 6319 1

原创 CSS 文本溢出显示省略号

文本溢出显示省略号针对一般的容器 .overflowTest { overflow: hidden; width: 200px; /*定义容器的宽度*/ text-overflow: ellipsis; white-space: nowrap; } 针对table中的td table{ table-layout: fixed; /*...

2018-08-08 14:56:19 241