URL编码参考手册

URL编码参考手册

属于ASCII字符集的(包括非保留字和保留字)(ASCII 是7比特字符集,包含了128个不同的字符值。此处有127个,少了设备控制字符中的DEL)ASCII 可印刷字符ASCII 字符URL-编码space%20!%21"%22#%23$%24%%25&%26 ...
【转】浏览器的渲染原理

【转】浏览器的渲染原理

How Browsers Work 这篇文章把浏览器的很多细节讲的很细,也有中文的翻译版本,现在转载的这篇是陈皓写的,目的的为了能在上班途中,或是坐马桶时就能读完,并能从中学会一些能用在工作上的东西。无论是作为开发,还是作为黑客,企图从Web 端注入 SQL,或是XSS 的时 ...
HTML和CSS中判断IE版本并实现相应HTML和CSS

HTML和CSS中判断IE版本并实现相应HTML和CSS

在编写网页代码时,各种浏览器的兼容性是个必须考虑的问题,有些时候无法找到适合所有浏览器的写法,就只能写根据浏览器种类区别的代码,这时就要用到判断代码了。 1.HTML代码中经过本人测试,在HTML代码中,区别各种浏览器的代码如下:<!--[if IE 6]> 仅支 ...
display和visibility的区别

display和visibility的区别

visibility隐藏的对象还保留对象显示时所占的物理空间,display则不保留。vilibility:hidden(隐藏)、visible(显示) display:none(隐藏)、block(显示) 可以保存下面的代码看看效果:具体步骤:代码示例: < d ...
fis3 scss 版本报错

fis3 scss 版本报错

fis3 scss编译需要安装的node版本为4.x,node版本高了fis会报错。如下图所示: ...
字体图标制作

字体图标制作

web端为什么需要做字体图标?性能好。在之前项目中,网页的图标是用的图片,当图标很多时,体积比较大。而且之前做过2年的UI设计,总觉得这样经常切图麻烦,当需要同一个图标大小不一时,直接放大图片会失真。字体图标制作流程1:第一当然需要一个设计师啦...我常用的方法,设计师设计出图标 ...
css中px、em和rem的区别总结

css中px、em和rem的区别总结

前言em 和 rem 都是灵活可扩展的单位,由浏览器转换为像素值,取决于设计中的字体大小,如果使用值 1em 或 1rem ,它可以被浏览器转换为从 16px 到 160px 或其他任意值。浏览器使用 1px ,那么 1px 始终显示为完全 1px。em 和 rem 的相同点使用 ...
H5弹性盒布局的使用(父容器属性)

H5弹性盒布局的使用(父容器属性)

为父容器添加display:flex/inline-flex 父容器可以使用的属性有:1.flex-direction:决定主轴的方向有四个属性值:row(默认值):主轴为水平方向,起点在左端。 row-reverse:主轴为水平方向,起点在右端。 column:主轴 ...
移动端布局方案 网易

移动端布局方案 网易

移动端布局:rem方案:页面中的任何元素都采用rem布局,包括字体。 1 <!DOCTYPE html> 2 <html lang="zh-CN"> 3 4 <head> 5 <meta charset= ...
限制html文本框input只能输入数字和小数点

限制html文本框input只能输入数字和小数点

代码:<input type="text" class="txt" name="qty" value="" onkeyup="this.value=this.value.replace ...
download 下载文件 IE兼容性处理

download 下载文件 IE兼容性处理

根据CANIUSE(http://caniuse.com/#search=download)download兼容性如下图所示:如上图所示,IE浏览器是不支持的。 1、测试代码: 1 <!doctype html> 2 <html lang="en& ...
HTML5本地图片裁剪并上传

HTML5本地图片裁剪并上传

最近做了一个项目,这个项目中需要实现的一个功能是:用户自定义头像(用户在本地选择一张图片,在本地将图片裁剪成满足系统要求尺寸的大小)。这个功能的需求是:头像最初剪切为一个正方形。如果选择的图片小于规定的头像要求尺寸,那么这整张图片都会作为头像。如果大于规定的尺寸,那么用户可以选择 ...
CSS中margin边界叠加问题及解决方案(转)

CSS中margin边界叠加问题及解决方案(转)

边界叠加简介边界叠加是一个相当简单的概念。但是,在实践中对网页进行布局时,它会造成许多混淆。简单地说,当两个垂直边界相遇时,它们将形成一个边界。这个边界的高度等于两个发生叠加的边界的高度中的较大者。 当一个元素出现在另一个元素上面时,第一个元素的底边界与第二个元素的顶边界发生 ...
CSS3 transition 浏览器兼容性

CSS3 transition 浏览器兼容性

1、兼容性根据canius(http://caniuse.com/#search=transition),transition 兼容性如下图所示: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 &l ...
谈谈一些有趣的CSS题目(十三)

谈谈一些有趣的CSS题目(十三)

开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节。解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉到生僻的 CSS 属性,赶紧去补习一下吧。不断更新,不断更新,不 ...
【原】老生常谈

【原】老生常谈

刚开始写这篇文章还是挺纠结的,因为网上搜索&ldquo;从输入url到页面展示到底发生了什么&rdquo;,你可以搜到一大堆的资料。而且面试这道题基本是必考题,二月份面试的时候,虽然知道这个过程发生了什么,不过当面试官一步步追问下去的,很多细节就不太清楚了。  最 ...
CSS3——复杂选择器

CSS3——复杂选择器

今天把视频里的CSS3复杂选择器部分看完了,来整理一下学到的知识点。1、兄弟选择器:同一位置级别,可称为兄弟元素a、相邻兄弟选择器:next紧紧跟在【当前元素之后的】(一个),指定选择器的元素       语法:通过“+”作为结合符eg: div+p ->紧跟 ...
Html利用CSS布局技巧

Html利用CSS布局技巧

单列布局水平居中水平居中的页面布局中最为常见的一种布局形式,多出现于标题,以及内容区域的组织形式,下面介绍四种实现水平居中的方法(注:下面各个实例中实现的是child元素的对齐操作,child元素的父容器是parent元素)使用inline-block 和 text-align实 ...
SEO整站优化,让你的网站更加与人不同

SEO整站优化,让你的网站更加与人不同

网站是一个企业在互联网的一个重要门户,是企业与客户重要的沟通桥梁。然而,如何让你的网站,在浩如烟海的网页汪洋中脱颖问出,无疑是每一间公司所期望的。那么如何才能更好的达成你想要的呢?广州先可思网络科技有限公司,为你提供更好的培训方案和优质的学习平台。  首先是对网站诊断,分析网站的 ...
关于li标签之间的间隔如何消除!

关于li标签之间的间隔如何消除!

问题:li标签用了display:inline之后虽然成功的合并在一行,但是li标签之间出现了间距。  原因:按enter键换行之后li标签之间存在着空格,正是这些空格占据了li标签之间的空间。  解决方案:1、将li标签之间用注释填补          <li>内容 ...
【转】浏览器的渲染原理简介

【转】浏览器的渲染原理简介

How Browsers Work 这篇文章把浏览器的很多细节讲的很细,也有中文的翻译版本,现在转载的这篇是陈皓写的,目的的为了能在上班途中,或是坐马桶时就能读完,并能从中学会一些能用在工作上的东西。 浏览器工作大流程先看个图从图中,可以看到:1) 浏览器会解析三个东西* ...
CSS实现div水平垂直居中

CSS实现div水平垂直居中

实现居中的方案有很多,这里介绍下纯CSS使用absolute配合margin的方案。1. div宽高固定width: 400px;height: 200px;position: absolute;top: 50%;left: 50%;margin-top: -100px;marg ...
纯CSS实现垂直居中的7种方法

纯CSS实现垂直居中的7种方法

今天申请博客通过了,给大家讲讲我所看到过的纯css实现垂直居中的各种方法。为什么要把它作为第一篇文章呢?因为这是我刚开始接触前端学到的对我最有用的知识,希望大家也可以从中获益!  在CSS中实现水平居中是非常简单的,行内元素设置其父元素的text-align:center,块级元 ...
web前端常用知识点

web前端常用知识点

1、常见的块级元素 内联元素 div -最常用的块级元素 dl - 和dt-dd 搭配使用的块级元素 form - 交互表单 h1 -h6- 大标题 hr - 水平分隔线 ...
FineReport中如何自定义登录界面

FineReport中如何自定义登录界面

在登录平台时,不希望使用FR默认的内置登录界面,想通过自定义登录界面实现登录操作,内置登录界面如下图: 登录界面,获取到用户名和密码的值,发送到报表系统,报表服务带着这两个参数访问认证地址进行认证。自定义登录界面登录界面设置自定义html登录页面:命名为login.html, ...
bootstrap IE8 兼容性处理

bootstrap IE8 兼容性处理

1 <!DOCTYPE html> 2 <html lang="zh-CN"> 3 4 <head> 5 <meta charset="utf-8"> 6 <met ...
html5新增标签

html5新增标签

html5新增标签<section></section> 表示内容区块,一般入章节、页眉、页脚或者页面中的其他部分。可以与h1-h6等元素结合起来使用,标示文档的结构 <section></section><article&g ...
【Little Demo】左右按钮tab选项卡双切换

【Little Demo】左右按钮tab选项卡双切换

通过前一篇文章 从简单的Tab标签到Tab图片切换 的说明,相关效果也就可以实现了。 1.左右按钮tab选项卡双切换很明显,左右两个按钮是 absolute 布局,另外就是内容部分和Tab标签部分。1) 先实现Tab内容和标签部分的显示:HTML代码:<div ...
深入理解CSS中的margin

深入理解CSS中的margin

1.css margin可以改变容器的尺寸   元素尺寸   可视尺寸--标准盒子模型中盒子的宽度是不包括margin值的,clientWidth   占据尺寸--包括margin的宽度 outWidth不在标准之中,jquery中有相对应的方法   margin与可视尺寸    ...
Html5游戏框架createJS组件

Html5游戏框架createJS组件

CreateJS库是一款HTML5游戏开发的引擎,是一套可以构建丰富交互体验的HTML5游戏的开源工具包,旨在降低HTML5项目的开发难度和成本,让开发者以熟悉的方式打造更具现代感的网络交互体验。掌握了CreateJS可以更方便的完成HTML5的游戏开发。CreateJS提供了E ...
30分钟搞定后台登录界面(103个后台PSD源文件、素材网站)

30分钟搞定后台登录界面(103个后台PSD源文件、素材网站)

去年八月时要做一个OA系统为了后台界面而烦恼,后来写了一篇博客(《后台管理UI的选择》)介绍了选择过程与常用后台UI,令我想不到的时竟然有许多开发者与我一样都为这个事情而花费不少时间,最后界面效果还是不佳;还好这个OA系统已经基本交付给客户在使用了,但登录界面还是非常难看,这几天 ...
丫空间项目总结

丫空间项目总结

最近准备春招,正好可以把之前的实习经历总结归纳以下,先来总结一下在开发丫空间时遇到的问题吧。一、背景说实话,开发这个网站技术含量其实蛮低的,无论是前端还是后端,都是入门级水平。毕竟当时(2015年9月)我算是前端刚入门,也就只会简单的切切图,JS也只能做些简单的DOM操作,连独自 ...
一些常用的meta标签

一些常用的meta标签

1 <!DOCTYPE html> <!-- 使用 HTML5 doctype,不区分大小写 --> 2 <html lang="zh-cmn-Hans"> <!-- 更加标准的 lang 属性写法 http://zh ...
rgba兼容性处理

rgba兼容性处理

根据caniuse(http://caniuse.com/#search=rgba),rgba兼容性为IE9以及以上浏览器。 实例代码: 1 <!doctype html> 2 <html lang="en"> 3 4 < ...
gradient渐变IE兼容处理

gradient渐变IE兼容处理

根据caniuse(http://caniuse.com/#search=gradient),rgba兼容性为IE10以及以上浏览器。 实例代码: 1 <!doctype html> 2 <html lang="en"> 3 ...
DOCTYPE的作用以及标准模式和兼容模式的区别

DOCTYPE的作用以及标准模式和兼容模式的区别

DOCTYPE的作用以及标准模式和兼容模式的区别<!doctype>声明必须处于HTML文档的头部,在<html>标签之前,告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。HTML5中不区分大小写&l ...
响应式开发(1)

响应式开发(1)

起因 因为越来越多的智能移动设备( mobile, tablet device )加入到互联网中来,移动互联网不再是独立的小网络了,而是成为了 Internet 的重要组成部分。响应式网络设计 ( RWD / AWD)的出现,目的是为移动设备提供更好的体验,并且整合从桌面到手机 ...
响应式开发(2)

响应式开发(2)

1.像素  因为浏览器不是根据硬件像素宽度工作的,而是根基DIPs工作的叫什么设备独立像素值,这个有个链接给你 (http://yunkus.com/physical-pixel-device-independent-pixels/)2.DPR  设备像素比DPR( ...
vue2源码浏览分析01

vue2源码浏览分析01

1.构造函数 Vue$3function Vue$3 (options) { if ("development" !== 'production' && !(this instanceof Vue$3)) { warn('Vue is ...
学习H5仿制网站时遇到的问题

学习H5仿制网站时遇到的问题

学习H5的第二周,开始仿制网站,在本过程中也发现了自己存在的更多问题。1.TOP块:在制作top中,遇到的第一个问题,一旦top左右的背景色不同该怎样去调整解决方式:建立两个div取代一个div 2.浮动排列使用的并不熟练:使用浮动时,总是出现各个块乱飘的现象解决方法, ...
移动端页面开发适配 rem布局原理

移动端页面开发适配 rem布局原理

主题 HTML移动端页面开发适配 rem布局原理什么是适配,为什么要适配我们拿到的设计图一般是以640,750,1080分辨率为基准设计的,而现在的手机终端各式各样,分辨率不同,逻辑像素不同 ,适口不同,所以为了让我们的页面在每个设备上都可以良好的展示,那么就需要为这些设备做统一 ...
记一些让footer始终位于网页底部的方法

记一些让footer始终位于网页底部的方法

上次说把网页的头部和尾部分离出来作为一个单独的文件,所有网页共用,这样比较方便修改,然而,,,我发现某些方法里尾部会紧跟在头部后面,把内容挤在下面。。而且有的页面内容少的话不能把尾部挤到最下面,所以,这次来研究一下怎么能让尾部一直在下面。。 先把html代码放出来:<b ...
【Little Demo】从简单的Tab标签到Tab图片切换

【Little Demo】从简单的Tab标签到Tab图片切换

Tab标签切换效果是比较流行的一种网站页面布局,视觉表现为美观大方,通过标签展示内容。目前在各大网站都有存在这种效果。例如:淘宝的黄金位置使用Tab标签切换效果,网易新闻等。 1.简单的 Tab 标签a) 先来实现Tab标签的头部通过HTML和CSS完成基本的标签效果。包括H ...
【Little Demo】Tab标签

【Little Demo】Tab标签

Tab标签切换效果是比较流行的一种网站页面布局,视觉表现为美观大方,通过标签展示内容。目前在各大网站都有存在这种效果。例如:淘宝的黄金位置使用Tab标签切换效果,网易新闻等。 1.简单的 Tab 标签a) 先来实现Tab标签的头部通过HTML和CSS完成基本的标签效果。包括H ...
10个值得前端收藏的CSS3动效库(工具)

10个值得前端收藏的CSS3动效库(工具)

现在网站重视的更多的是用户体验,而优秀的动效则能使你的应用更具交互性,从而吸引更多用户的使用。在网站中加入一些动效会让整个页面看起来很有动感。但是如果你对CSS3中定义动效还不熟练,或希望采用更加简单直接的方式在你的应用中引入动效的话,你可以参考并使用下面的这10个优秀动效库(工 ...
静态变量导致的内存泄露

静态变量导致的内存泄露

public class MainActivity extends Activity{ private static final String TAG = ...
关于bootstrap原理及优缺点

关于bootstrap原理及优缺点

网格系统的实现原理,是通过定义容器大小,平分12份(也有平分成24份或32份,但12份是最常见的),再调整内外边距,最后结合媒体查询,就制作出了强大的响应式网格系统。Bootstrap框架中的网格系统就是将容器平分成12份。bootstrap优缺点:1.bootstap最近发布了 ...
CSS前端开发学习总结、一

CSS前端开发学习总结、一

1. 属性选择器: 2. CSS伪类选择器:3. CSS伪元素:4. CSS优先级:5. 行内标签:6. 块级标签:7. Display:8. Line-height:行高9. text-indent:首行缩进10.white-space ...
css相关

css相关

textarea去掉拉伸resize:none;input button等去掉选中的默认样式input,button,select,textarea{outline:none;}超出显示省略号overflow:hidden;white-space:nowrap;text-over ...
CSS 布局整理

CSS 布局整理

1.css垂直水平居中效果:HTML代码:<div id="container"> <div id="center-div"></div></div> CSS实现:都设置居中 div块的 ...
第一页   上一页   下一页   末页
1/237页   共: 11832
网页设计1网页设计2网页设计3网页设计4网页设计5网页设计6网页设计7网页设计8网页设计9网页设计10网页设计11网页设计12网页设计13网页设计14网页设计15网页设计16网页设计17网页设计18网页设计19网页设计20网页设计21网页设计22网页设计23网页设计24网页设计25网页设计26网页设计27网页设计28网页设计29网页设计30网页设计31网页设计32网页设计33网页设计34网页设计35网页设计36网页设计37网页设计38网页设计39网页设计40网页设计41网页设计42网页设计43网页设计44网页设计45网页设计46网页设计47网页设计48网页设计49网页设计50网页设计51网页设计52网页设计53网页设计54网页设计55网页设计56网页设计57网页设计58网页设计59网页设计60网页设计61网页设计62网页设计63网页设计64网页设计65网页设计66网页设计67网页设计68网页设计69网页设计70网页设计71网页设计72网页设计73网页设计74网页设计75网页设计76网页设计77网页设计78网页设计79网页设计80网页设计81网页设计82网页设计83网页设计84网页设计85网页设计86网页设计87网页设计88网页设计89网页设计90网页设计91网页设计92网页设计93网页设计94网页设计95网页设计96网页设计97网页设计98网页设计99网页设计100网页设计101网页设计102网页设计103网页设计104网页设计105网页设计106网页设计107网页设计108网页设计109网页设计110网页设计111网页设计112网页设计113网页设计114网页设计115网页设计116网页设计117网页设计118网页设计119网页设计120网页设计121网页设计122网页设计123网页设计124网页设计125网页设计126网页设计127网页设计128网页设计129网页设计130网页设计131网页设计132网页设计133网页设计134网页设计135网页设计136网页设计137网页设计138网页设计139网页设计140网页设计141网页设计142网页设计143网页设计144网页设计145网页设计146网页设计147网页设计148网页设计149网页设计150网页设计151网页设计152网页设计153网页设计154网页设计155网页设计156网页设计157网页设计158网页设计159网页设计160网页设计161网页设计162网页设计163网页设计164网页设计165网页设计166网页设计167网页设计168网页设计169网页设计170网页设计171网页设计172网页设计173网页设计174网页设计175网页设计176网页设计177网页设计178网页设计179网页设计180网页设计181网页设计182网页设计183网页设计184网页设计185网页设计186网页设计187网页设计188网页设计189网页设计190网页设计191网页设计192网页设计193网页设计194网页设计195网页设计196网页设计197网页设计198网页设计199网页设计200网页设计201网页设计202网页设计203网页设计204网页设计205网页设计206网页设计207网页设计208网页设计209网页设计210网页设计211网页设计212网页设计213网页设计214网页设计215网页设计216网页设计217网页设计218网页设计219网页设计220网页设计221网页设计222网页设计223网页设计224网页设计225网页设计226网页设计227网页设计228网页设计229网页设计230网页设计231网页设计232网页设计233网页设计234网页设计235网页设计236网页设计237