编程开发 - 教程之家

303浏览

0评论

使用纯CSS3代码实现简单的图片轮播

1.基本布局：将5张图片左浮动横向并排放入一个div容器（#photos）内，图片设置统一尺寸，div宽度设置5个图片的总尺寸，然后放入相框容器div（#frame），相框设置1个图片的大小并设置溢出隐藏，...

2018-08-26 19:31:35

612浏览

0评论

js判断用户UA并自动跳转到对应网页

前几天看到一个关于万能收钱码的教程，里面有个方法很有意思，用户访问我二维码地址后，可以通过UA来判断用户使用的是哪款APP。可以说这个功能就是万能收款码的核心了，下面就...

2018-08-26 19:30:02

319浏览

0评论

js使用base64编码隐藏敏感字符

首先声明一下，这里之所以说用base64来编码字符，是因为它编码之后的字符是人无法理解的东西，并且中英文都一样可以编码成人类不认识的字符串。这里不讨论编码的安全性，要安全的话...

2018-08-26 00:18:47

322浏览

0评论

jQuery移动HTML元素位置

最近在做WordPress主题时遇到了评论框的一些问题，主要是评论采用什么形式来展现给用户。其一是使用弹出层，将表单展示在弹出层上。还有一种就是今天我们要讲的jQuery移动HTML...

2018-08-26 00:15:42

326浏览

0评论

JavaScript三种url编码方式的区别

url编码顾名思义，将字符串编码成url。经常使用浏览器的朋友就会发现，中文的网络地址会被浏览器编码成我们不认识的字符。只有 0-9[a-Z] $ – _ . + ! * ‘ ( ) , 以...

2018-08-26 00:14:57

215浏览

0评论

纯JS实现jQuery的addClass和removeClass功能

jQuery不能用或者jQuery没法及时使用的时候，有需要操作节点的className，就可以用这些代码了。var addClass = function(elem, str) { if (elem.className == str) retu...

2018-08-26 00:13:18

638浏览

0评论

纯Javascript实现淡入淡出效果

说到js的渐变显示与消失，多数朋友会想到JQuery里面的fadeIn()、fadeOut()或fadeToggle()。但如果仅仅是为了引入这样的一个效果，而去调用了庞大JQuery库，会不会显得有...

2018-08-26 00:12:31

872浏览

0评论

PHP将文字生成透明背景图片代码

本文讲的是用php将生成透明背景图片png的代码，主要目的是为了一些企业网站的电话不想被搜索引擎收录，所以用到图片的形式显示，不能每次更改电话号码很不方便，所以就研究一下...

2018-08-26 00:11:31

300浏览

0评论

HTML5实现获取地理位置信息并定位功能

前言这篇文章主要介绍了HTML5实现获取地理位置信息并定位功能,本文讲解了原生HTML5、百度地图、谷歌地图等三种获取理位置信息并定位的方法,需要的朋友可以参考下。HTML5提...

2018-08-26 00:09:53

257浏览

0评论

用css禁止文字被选中

有时候，为了让用户有更好的体验，需要禁用掉文本选中功能比如：使用a标签模拟按钮，如果不禁用掉文本选中功能，那么双击时会选中文字，用起来很不爽。多数情况下，只需要使用CSS样式就可...

2018-08-26 00:09:14

250浏览

0评论

js判断手机端并跳转方法

本文介绍js判断手机端并跳转，这段代码最好放到head里面，这样加在是能够及时的跳转。<script> function is_mobile() {var regex_match = /(nokia|iphone|android|motor...

2018-08-26 00:07:51

361浏览

0评论

CSS三大特性（继承、优先级、层叠）

1.继承性作用：子元素可以继承父元素的样式继承性发生的前提是包含（嵌套关系）★文字颜色可以继承★文字大小可以继承★字体可以继续★字体粗细可以继承★文字风格可以继承★行高...

2018-08-26 00:07:09

241浏览

0评论

CSS技巧：常用的几个CSS前端效果更轻松的写页面

做页面需要一定的 CSS 基本功，虽然现在有很多成熟的框架如 bootstrap 等，我们轻松的就就可以做出一些页面效果。但是掌握每一个常见效果的写法还是很重要的，下面整理出一些常见...

2018-08-25 23:49:29

365浏览

0评论

CSS技巧：移动端弹出层滑动时禁止底层滑动

在开发移动端网站的时候，我们经常会遇到弹出层的情况（如全屏的导航栏、提示遮罩等），这时候会有一个用户体验上的小 bug：当我们操作点出弹出层时，如果此时滑动屏幕，你会发现弹出层下...

2018-08-25 23:48:24

535浏览

0评论

使用 HTMLPurifier 来解决 Laravel 5 中的 XSS 跨站脚本攻击安全问题

HTMLPurifier for Laravel 是对 HTMLPurifier 针对 Laravel 框架的一个封装.使用 Composer 安装：composer require mews/purifier在 config/app.php 文件的 providers 数组添...

2018-08-20 23:21:54

282浏览

0评论

PHP中in_array的隐式转换

问题今天在写一个接口的时候，需要传入大量的基本信息参数，参数分别是int和string两种类型，为了校验方便，我打算把所有的参数都放在数组中，然后用in_array(0, $param)判断...

2018-08-20 23:21:12

243浏览

0评论

Jquery前端分页插件pagination使用

插件描述：JqueryPagination是一个轻量级的jquery分页插件。只需几个简单的配置就可以生成分页控件。并且支持ajax获取数据，自定义请求参数，提供多种方法，事件和回调函数，功能全面...

2018-08-20 23:18:00

273浏览

0评论

jquery的height()和javascript的height总结，js获取屏幕高度

在javascript和jquery中，都有对各种高度的写法，在这里，我们就着重讲一下窗口、文档等高度的理解。(宽度和高度差不多！)1. jquery的各种高度首先来说一说$(document)和$(window)，...

2018-08-19 21:22:06

307浏览

0评论

css input checkbox和radio样式美化

效果图如下：html代码如下：<span class="pay_list_c1 on"><input type="radio" checked="checked" name="paylist" value="1" class="radioclass"></span>css代码:.pay_list_c1...

2018-08-19 21:19:15

507浏览

0评论

css input[type=file] 样式美化，input上传按钮美化

我们在做input文本上传的时候，html自带的上传按钮比较丑，如何对其进行美化呢？同理：input checkbox美化，input radio美化是一个道理的，后面文章会总结。1. 思路input file上传按钮...

2018-08-19 21:18:15

221浏览

0评论

HTML5的 input:file上传类型控制

1. input:file属性属性值有以下几个比较常用： accept：表示可以选择的文件MIME类型，多个MIME类型用英文逗号分开，常用的MIME类型见下表。 multiple：是否可以选择多...

2018-08-19 21:17:40

229浏览

0评论

css代码缩写,占用更少的带宽

在写css代码的时候,有时候会忘记css代码的缩写,故整理成文章,方便查阅盒模型代码简写盒模型时外边距(margin)、内边距(paddin...

2018-08-19 21:17:08

32582浏览

0评论

各浏览器CSS HACK

针对Chrome和Safari等Webkit核心浏览器的CSS hack代码@media screen and (-webkit-min-device-pixel-ratio:0) { /* Webkit内核兼容CSS */ } 示例：@media screen and...

2018-08-19 20:53:08

388浏览

0评论

CSS样式中大于号的使用及CSS中处理继承方法

继承在一定程度上让程序在编写的过程中更加方便，但是有时候也会给我们的程序带来一定的困扰，所以认真的学习继承的原理，以及处理的方法很重要。下面是Css中处理继承的一个方法...

2018-08-19 20:52:18

573浏览

0评论

css/js 图片自适应、自动满屏和拉伸问题解决

网站要自适应，其中一个工作就是必然要对图片的宽度进行处理。一般来说，网站图片插入的时候，编辑器会自动增加width和height的值，也就是图片的宽度高度，虽然可以去掉，也可以定义，但...

2018-08-19 20:51:15

285浏览

0评论

css教程之div文字图片混合型下图片居中

最近有童鞋问我，在一个div里面，其中有文字和图片，现在想要的效果是文字左对齐，图片居中对齐。然后说对图片定义text-align:center;无效。我说这里用text-align:center;肯定没有...

2018-08-19 20:49:46

509浏览

0评论

CSS3 Media Queries实现响应式网页设计

记得很早之前，那时候还没有接触css3，已经通过media=”print”来定义打印样式了，那个时候也不是很了解，只是单纯了写着好玩，其实没多大用处。随着目前移动设备的普及，单纯...

2018-08-19 20:49:08

248浏览

0评论

CSS控制文字文本超过宽度或高度自动隐藏

做css的时候发现需要对文字隐藏，所以这里记录下，下次好使用。.text1 { word-break: keep-all;/*不换行*/ white-space: nowrap;/*不换行*/ overflow: hidden;...

2018-08-19 20:48:20

290浏览

0评论

纯CSS制作的TAB选项卡

这里主要使用表单的单选按钮来实现这个TAB显示和隐藏，首页tab里的内容默认隐藏，如果单选按钮为选中状态（checked）就显示内容。具体请看下面代码。<ul class="tabs"> <li> <i...

2018-08-19 20:47:43

239浏览

0评论

说说css中pt、px、em、rem都扮演了什么角色

前段时间，终于仔仔细细的把pt、px、em、rem了解了一遍，简单整理了一下做个记录。pt、px、em、rem都是什么pt单位名称为点（Point），绝对长度单位。现在网页中出现得很少甚至不出现，...

2018-08-19 20:46:15

488浏览

0评论

如何改变Checkbox的尺寸大小

比较复杂的方法input[type=checkbox]{ /* Double-sized Checkboxes */ -ms-transform: scale(2); /* IE */ -moz-transform: scale(2); /* FF */ -webkit-transform...

2018-08-19 20:45:28

349浏览

0评论

取消chrome浏览器下input和textarea的默认样式

最近一个细节引起了我的注意，chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框，而且textarea还可以任意拖动放大，这是不能容忍的，影响美观不说，有时候拖动tex...

2018-08-19 20:44:27

251浏览

0评论

CSS让图片垂直居中的几种技巧

先来分享下来自老外的 The only (and the best cross-browser) way as I know is to use an inline-block helper with height: 100% and vertical-align: middle on...

2018-08-14 22:39:07

234浏览

0评论

如何使区块保持比例自动缩放

1. 对于img元素而言，使用auto height：img{ min-width: 100%; height: auto; } 2.不过对于DIV块元素，这样做没用，块大小总是按照内容或内含元素来匹配。解决方案是使...

2018-08-14 22:38:34

282浏览

0评论

纯css制作带三角的边框

下面的效果完全是用css 来实现的，那么是怎么实现的呢，我们知道 html 中有一些特殊的字符，通过特殊字符，利用 css 中的margin或者position方法完全可以实现以上效果，感兴趣的...

2018-08-14 22:37:48

278浏览

0评论

纯CSS打造可折叠树状菜单

1：Html代码<li><label for="subsubfolder1">下级</label><input id="subsubfolder1" type="checkbox" /><ol><li class="file"><a>下级</a></li><li><label for="sub...

2018-08-14 22:36:53

265浏览

0评论

CSS3 pointer-events下层元素被点击

是否曾经有过这样的经历：把一个元素置于另一个元素之上，而希望下面的那个元素成为可点击的？现在，利用css的pointer-events属性即可做到。CSS pointer-eventsPointer-events原本...

2018-08-14 22:35:51

220浏览

0评论

搜索框提示文字点击消失的效果

当输入框默认显示“提示的文字”当鼠标点击的时候自动变成空白，如果不输入任何文字再点击其他地方则再次显示“提示的文字”，如果输入了文字再点击其他地方则无反映，代码如...

2018-08-14 22:35:13

298浏览

0评论

CSS文字两端对齐

css文字两端对齐 text-align:Justify(火狐); text-justify:inter-ideograph(IE) text-justify(IE) 基本语法text-justify:auto|distribute|distribute-all-...

2018-08-14 22:33:56

577浏览

0评论

CSS如何正确显示人民币符号￥

我们做网页时要正确显示人民币符号可以用如下办法：CSS：在中文输入法下用shift+4输出的￥在微软雅黑（Microsoft YaHei），华文细黑（STXihei），（MingLiu）这几个字体下能正确显示 font-family:...

2018-08-14 22:33:30

341浏览

0评论

IE6 IE7 IE8图片等比例缩小问题

IE7、IE8设置max-width后，把高度设为auto,当图片宽度超过设置的最大宽度后，会自动缩小到设置的max-width值，但是高度并没有我们预想的按比例缩小。而在firefox中却可以完美的按...

2018-08-14 22:32:23

283浏览

0评论

是否该使用IE浏览器特有的expression

很多用户为了解决IE浏览器的一些CSS HACK，总是习惯性的使用 expression()，其实用expression会非常耗资源，以前referer后台有这样用，后来发现网页莫名奇妙的狂占内存，后来发现是ex...

2018-08-14 22:31:47

286浏览

0评论

CSS3实现隔行变色

隔行变换样式是一项基本的网页表现形式，如何通过CSS3实现呢?今天我们就拿隔行显示不同背景色为例做演示：代码如下：<head><meta http-equiv="Content-Type" content="text/html;...

2018-08-14 22:30:57

560浏览

0评论

CSS 中文字体的英文名称 (simhei, simsun) 宋体微软雅黑

Mac OS的一些：华文细黑：STHeiti Light [STXihei]华文黑体：STHeiti华文楷体：STKaiti华文宋体：STSong华文仿宋：STFangsong俪黑 Pro：LiHei Pro Medium俪宋 Pro：LiSong Pro Light标楷体：B...

2018-08-14 22:30:15

212浏览

0评论

去除鼠标点击输入框所产生的边框

在表单中输入文字时，在有些浏览器中会产生边框，比如在360浏览器中，点击搜索框，就会出现边框。这种边框的出现是因为CSS中的focus伪类造成的，去除边框只需要在CSS加入:inp...

2018-08-14 22:29:14

1264浏览

0评论

调整input里面的输入光标大小

条件 input输入框用一个背景图模拟，设置height和line-height一样的高度，使里面的输入文字能够垂直居中。问题 IE浏览器和火狐浏览器：不管该行有没有文字，光标高度...

2018-08-14 22:28:42

312浏览

0评论

article和section的区别

article 文章是一个独立的，单独的一段离散的内容。例如一篇博客的帖子，或者一个email中的单个email。一篇博客中的帖子，可以由rss或者其他方法聚合，而不需要更多的上...

2018-08-14 22:27:23

324浏览

0评论

CSS最小宽度和最小高度的用法

min-height 限制最小高度min-width 限制最小宽度IE6不支持min-height和min-width,但是一旦内容超过容器，容器会被自动撑大，所以给IE6专门设置一个宽度就是他的最小宽度。_widt...

2018-08-14 22:26:55

256浏览

0评论

瀑布流布局的两种方式：传统多列浮动和绝对定位布局

传统多列浮动各列固定宽度，并且左浮动；一列中的数据块为一组，列中的每个数据块依次排列即可；更多数据加载时，需要分别插入到不同的列上；优点布局简单，应该...

2018-08-14 22:26:19

309浏览

0评论

CSS+jquery+JS轻松实现瀑布流布局

CSS部分核心代码<style type="text/css">.case-list {position:relative;}.case-list li {position:absolute;}.case-list li img {width:200px;}</style> HTML部分...

2018-08-14 22:25:42

热门文章