你的位置:首页 > 网页设计
清除浮动专题
2017-01-22 12:00:09

清除浮动专题

1.三个已经混淆的概念(1)不浮动float:none;(2)清除周围的浮动元素(3)清除子元素浮动对父元素的影响 2.什么是清除浮动清除浮动不是把当前标签的浮动给清楚了,如果这样,还加浮动做什么。其实清除浮动指的是清除当前元素旁边的浮动元素,但是当前元素又不能影响别人,打不 ...
HTML5行业现状与未来
2017-01-22 00:00:09

HTML5行业现状与未来

以匠人之心,码出多彩程序人生 1. 大幅动荡后,即将进入平稳期HTML5(WEB前端),在2012年及以前,一直处于一种萌芽期的状态当中,直至2013年才进入行业的成长期。HTML5(WEB前端)在2013和2014年,随着行业的推动慢慢的增长,直至2015年迎来了行业的大爆发, ...
CSS的优先级和继承问题
2017-01-22 00:00:08

CSS的优先级和继承问题

CSS的优先级和继承问题★CSS的冲突,即优先级 CSS本身的设置可以同时应用多个样式在同一个元素,此时样式之间可能出现冲突而达不到用户所想要的效果。 ★解决CSS冲突的优先级规则: ● CSS层叠样式表引入方法的优先级:内联式>内嵌式>链接式>导入式 ● 在多 ...
CSS常用属性
2017-01-22 00:00:07

CSS常用属性

CSS常用属性☛关于CSS属性个人建议查看手册更加详细方便,我这里就几种常用属性进行分类并简单取几个常用属性值,仅供跟我一样刚学习前端的人作为入门而用。 1.字体样式字体的缩写,写法是font:font-style|| font-variant ||font-weig ...
js和jquery获取当前元素的内容
html代码<div>测试文本</div>js:div.innerHTMLjQuery:div.html() ...
es6笔记7^_^class
2017-01-22 00:00:05

es6笔记7^_^class

ES6提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板。通过class关键字,可以定义类。  部分来自JavaScript ES6 class指南、mozilla https://developer.mozilla.org/zh-CN/docs/Web/ ...
2D转换下的zoom和transform:scale的区别
一、什么是zoom  在我们做项目和查看别人的网页的时候总会看到在一些元素的样式里,看到有一个家伙孤零零的待在那里,它到底是谁呢?    它的名字叫zoom,zoom的意思是“变焦”,虽然在摄影的领域经常被提到,但是在web的世界里也可以这样理解它的意思,就是改变元素的尺寸,进行 ...
bootstrap中的 form表单属性role=form有什么作用?
html 里面的 role 本质上是增强语义性,当现有的HTML标签不能充分表达语义性的时候,就可以借助role来说明。通常这种情况出现在一些自定义的组件上,这样可增强组件的可访问性、可用性和可交互性。role的作用是描述一个非标准的tag的实际作用。比如用div做button, ...
前端开发者手册
2017-01-21 12:00:09

前端开发者手册

这是任何人都可以用来学习前端的实践手册, 它概述并讨论了前端工程的实践: 该如何学习以及实践时该使用什么工具.撰写该手册的目的有两个: 一是为潜在以及正在实践的前端开发人员提供一个包括学习资料和开发工具的专业资源; 二是该手册可以被管理者, CTO, 讲师和猎头用来作为洞察前端开 ...
怎么应用vertical
2017-01-21 12:00:06

怎么应用vertical

vertical-align 的使用 以前总是想要一些元素垂直居中对齐,经常用line-height,可是对于图片来说,line-height的表现并不理想(非常不理想)可看我的文章:line-height系列(二),所以得用vertical-align:middle。然而用 ...
css3模拟jq点击事件
2017-01-21 12:00:04

css3模拟jq点击事件

还是这个梗,收好冷。今天是一个css3模拟jq点击事件,因为我发现,css3中没有类似于,js的点击事件,那么,可不可以仿照jq的效果,类似的做一个呢?主要用到,input里面的radio 单选按钮,然后后面跟一个a标签,让radio覆盖在a上,那为什么不直接把 a放在radio ...
如何用CSS快速布局(一)—— 布局元素详细
要快速进行网页排版布局,则必须对布局的元素有清晰的了解,才不会总是在细节处出错。这一篇先详解有关布局的因素作为布局基础:块级元素and内联元素、盒模型、准确定位、元素对齐、样式继承。下一篇则重点描述快速布局思路。一、什么是块级元素和内联元素1,块级元素:display:block ...
es6笔记6^_^generator
2017-01-21 12:00:02

es6笔记6^_^generator

1.简介 Generator函数是一个函数的内部状态的遍历器(也就是说,Generator函数是一个状态机)。 形式上,Generator函数是一个普通函数,但是有两个特征。function命令与函数名之间有一个星号*;函数体内部使用yield语句,定义遍历器的每个成员,即不 ...
animation 动画属性
2017-01-20 12:00:15

animation 动画属性

animation-name: 选择器名称animation-duration: 完成动画所需时间animation-timing-function: 动画的速度曲线 值描述测试linear动画从头到尾的速度是相同的。测试ease默认。动画以低速开始,然后加快,在结束 ...
ueditor编辑器插件 chrome中图片上传框延时问题
最近在项目中使用ueditor插件进行文字的在线编辑功能时,发现这个插件的图片上传弹框在chrome浏览器延迟非常的厉害。经过多方搜索,终于解决。现将解决方案记录如下: 1、修改/Ueditor/dialogs/image/image.j ...
H5移动端知识点总结
2017-01-20 12:00:13

H5移动端知识点总结

来自: http://www.cnblogs.com/tugenhua0707/p/5180841.htmlH5移动端知识点总结阅读目录移动开发基本知识点calc基本用法box-sizing的理解及使用理解display:box的布局理解flex布局Flex布局兼容知识点总结 ...
修改输入框placeholder文字默认颜色
针对placeholder来设置想要的颜色:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #000; opacity:1; }::-moz-placeholder { /* Mozilla Firefox 19+ ...
2D转换下的zoom和transfor:scale的区别
一、什么是zoom  在我们做项目和查看别人的网页的时候总会看到在一些元素的样式里,看到有一个家伙孤零零的待在那里,它到底是谁呢?    它的名字叫zoom,zoom的意思是“变焦”,虽然在摄影的领域经常被提到,但是在web的世界里也可以这样理解它的意思,就是改变元素的尺寸,进行 ...
css里颜色的那些事儿(合法颜色值)
css中主要有六种方法指定颜色:1.十六进制颜色2.RGB颜色3.RGBA颜色4.HSL色彩5.HSLA颜色6.预定义/跨浏览器的颜色名称前三种是我们最常见的,也是用的最多的,而后三种对于初学者来说简直就是“什么鬼?”。但是!不用怕,今天我们就来好好聊聊css中的这六位小成员的事 ...
纯CSS的三角符号
2017-01-20 12:00:08

纯CSS的三角符号

项目中经常用到三角形,现在给大家讲下用纯CSS写的下三角实心图形1 .triangle{2 border-width: 5px 4px 0 4px;3 border-color: #454A7Btransparent transparent transparent;4 ...
移动端H5页面遇到的问题总结
最近刚做完一个移动端的项目,产品之无敌,过程之艰辛,我就不多说了,记录下在这个项目中遇到的问题,以防万一,虽然这些可能都是已经被N多前辈解决掉了的问题,也放在这里,算是为自己漫漫前端路铺了一颗小石子儿吧,也在文末留下自己未能解决的疑问,希望看到的朋友能解惑。  都知道做移动端的开 ...
css3 小图标提示特效
2017-01-20 12:00:03

css3 小图标提示特效

最近的计划,就是每天来几个特效,当然这里有限制,在什么候选区只能放一个,还每天有限制发布的,哎,啊 终于写完了,看到一个挺好玩的东西,想到能不能用网页的特效做出来,试试呗!不过,一想肯东有很多的相类似的了,不过,反正就是挺有成就感的。高兴即来淫诗一首,两眼黑黑,灯下黑黑,嘿嘿嘿嘿 ...
es6笔记5^_^set、map、iterator
一、set1.基本用法  数据结构Set类似于数组,但是成员的值都是唯一的,没有重复的值。 let s = new Set(); [2,3,5,4,5,2,2].map(x => s.add(x)) for (let i of s) {console.log(i)}/ ...
es6笔记4^_^function
2017-01-19 12:00:12

es6笔记4^_^function

一、function默认参数  现在可以在定义函数的时候指定参数的默认值了,而不用像以前那样通过逻辑或操作符来达到目的了。  es5function sayHello(name){ //传统的指定默认参数的方式 let name1 = name||'hubwiz'; ...
【CSS3】使用JAVASCript触发过渡效果
使用 :hover 和 :focus 这样的伪类,我们可以很方便的将元素从一个样式切换到另一个样式,而且切换是会有过渡效果。但有时我们想要使用 js 来驱动过渡(即在代码中触发过渡)也是可以实现的。和普通过渡一样,先创建两个样式规则,一个是元素的初始状态, ...
jQuery鼠标悬停3d菜单展开动画
效果体验:http://hovertree.com/texiao/jquery/93/竖直的主菜单贴着页面左侧,当光标移入菜单项时,以3D动画的方式弹出对应的二级菜单。采用jQuery和CSS3实现。支持Chrome,火狐,Edge等浏览器。效果图:代码如下:<!DOCTY ...
网站图标多,首次打开慢,怎么破?
背景项目开发过程中可能会遇到首次打开一个工具栏有特别多图标的网站,图标加载特别慢原因分析如果服务器上存的图片都是单独分开的话,那打开网站后,面板上的所有图标是不是都要请求服务器呢?次数是不是就多了?那我们就减少请求服务器次数。优化一是本次文章的主题:切图,其它优化是网页优化优化一 ...
div中嵌套div中使用margin
2017-01-19 00:06:53

div中嵌套div中使用margin

div中嵌套div中使用margin-top失效问题 ...
head中的title显示在body中
2017-01-19 00:06:16

head中的title显示在body中

今天遇到一个问题,就是title中的内容会显示在body中1 <head>2 <title>324234</title>3 </head>网上搜了一下是说编码方式有问题会出现这种情况,于是查看我的编码情况,发现没有任何问题。于是开始 ...
Chrome浏览器正常,IE下界面却乱了
背景:项目实战中总会遇到一些小问题,IE特别多Chrome浏览器页面正常,IE下界面就乱了原因分析1、首先想到的是代码有米有问题呢?主要指的是兼容性2、兼容性没有问题,那我们打开IE的开发工具看看,纳尼,居然是IE7、8、9、10、11随便一个。反正不是你想要的IE版本模式好吧, ...
如何自定义博客园样式
2017-01-19 00:05:44

如何自定义博客园样式

苦恼每次看到别人的博客样式都感觉很舒服,很好看。当自己开通博客后,使用了预置的样式也无法达到自己想要的页面效果,怎么办?废话不多说,直奔主题如何设置博客园自定义的样式还有这样的功能,我怎么不知道,后来也是看到园友发表过类似的文章才知道的。首先我们要在后台设置tab页里,找到博客皮 ...
列表样式
2017-01-19 00:00:49

列表样式

1.board.w<view > <view > <scroll-view scroll-y="true" height="100%"> <block wx:for="{{board ...
es6笔记3^_^object
2017-01-18 12:00:09

es6笔记3^_^object

一、destructuring  ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构Destructuring。//es5if(1){ let cat = 'ken'; let dog = 'lili'; let zoo = {cat: cat, d ...
写一个简单的CSS表
2017-01-18 12:00:08

写一个简单的CSS表

1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 4 <titl ...
用canvas编写表白动画
2017-01-18 12:00:06

用canvas编写表白动画

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> < ...
用c3制作3d盒子旋转特效
2017-01-18 12:00:06

用c3制作3d盒子旋转特效

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> < ...
html标签详解(1)
2017-01-18 00:00:31

html标签详解(1)

http标签详解及讲解 1.基础标签1 <!DOCTYPE html> <!--表示文本类型-->2 <html> <!--<html></html> ...
html标签详解(2)
2017-01-18 00:00:27

html标签详解(2)

http标签详解声明 1:这里的文字都是我从我自己csdn账号拷贝过来,是本人学习总结的结晶,所以请尊重本作品。2:如要要转载本文章,则要说明文字的出处。3:如有哪里不对欢迎指出。在上一篇文章中主要讲了,http的一些基础标签,比方说链接标签,图片标签,html框架等,那接下来主 ...
IE8下实现兼容rgba
2017-01-18 00:00:24

IE8下实现兼容rgba

前几天做一个项目的时候遇到一个问题,透明度的问题,今天空了给大家讲讲我的一些看法和怎样兼容透明度一:两种方式 (IE9+)  1:rgba() (只是背景透明)  2:opcity (里面的内容与背景都透明)二:解释区别在css3以前,我们的css中的颜色都是基于R ...
sql注入【手工及一些工具】
Sql注入原理分析:  网站程序存在可控传递参数,参数未进行过滤直接带入数据库查询,导致攻击者可通过传递恶意sql语句代码进行执行攻击。Sql注入产生条件  1.必须有参数传递  2.参数值带入数据库查询并执行判断是不是用注入:  例:http://www.xxx.xxx asp ...
如何在网页中循环播放声音?
HTML中可以播放声音的标签有bgsound、embed、audio、object等,下面先简单介绍这几个标签 <bgsound>:  <bgsound> 是用来插入背景音乐,但只适用于 ie,其参数设定不多。如下  <bgsound src=& ...
DIV+CSS详解
2017-01-18 00:00:21

DIV+CSS详解

DIV+CSS详解✪DIV+CSS"这种叫法其实是一种不准确的叫法  在做笔记的最前面必须先给大家纠正一个错误,就是"DIV+CSS"这种叫法其实是一种不准确的叫法,是国人给这种布局标准页面的方法起的名字,是对技术理解不够透彻导致的,而标准的叫法是什 ...
利用Kaptcha.jar生成图片验证码(以下源码可以直接复制并自定义修改)
说明:Kaptcha是一个很实用的验证码生成工具,它可以生成各种样式的验证码,因为它是可以配置的 目录: 一 实现步骤 二 实例 A 编写jsp页面 B 配置web.一 实现步骤 1 下载Kaptcha-2.3.jar 2 复制jar包,放于项目的lib包下 ...
css块级标签,行内标签,行内块标签的转换(2)
css块级标签,行内标签,行内块标签的转换版权声明本文原创作者:雨点的名字作者博客地址:https://home.cnblogs.com/u/qdhxhz/ 在基础1中,我详细讲了css的常见属性,几种不同的选择器,在此基础之上我们来进一步地认识它们的特性从而 ...
CSS清楚浮动
2017-01-18 00:00:16

CSS清楚浮动

CSS清楚浮动方法1.给父级一个height属性<style type="text/css"> .div1{background:#000080;border:1px solid red;/*解决代码*/height:200px;} .div2{b ...
Flexible 弹性盒子模型之CSS order 属性
实例设置弹性盒对象元素的顺序:div#myRedDIV {order:2;}div#myBlueDIV {order:4;}div#myGreenDIV {order:3;}div#myPinkDIV {order:1;}复制效果预览浏览器支持表格中的数字表示支持该属性的第一个浏 ...
HTML页面3秒后自动跳转的三种常见方法
在练习中,我们常常遇到一种问题就是,怎么实现页面N秒之后自动跳转呢? 我自己遇到问题和查找资料,总结了3个方法 方法1: 最简单的一种:直接在前面<head>里面添加代码: <span style="font-size:18px;&qu ...
关于清除浮动的几种方法
直到写这篇随笔,才认真的去研究了一下每一种清除浮动的方法到底是什么原理(⊙﹏⊙)b 对于刚刚接触CSS的人来说,就像当时的我一样,在做一些小项目和练习的时候,总会莫名其妙的问自己“哎!?我的div去哪了!?( ⊙ o ⊙ )”然后默默地加上一个背景色来看一下我辛辛苦苦写的小 ...
结合swiper使用图片懒加载
本人渣渣一枚,技术一般,记录下笔记,大神勿喷,可以留下优化建议,谢谢  最近刚刚做了个展示型的网站,使用swiper搭的框架,因为图片比较多,所 以首次加载稍微有些慢,虽然压缩过了,但是尽可能的优化吧,刚开始找了个懒加载的一个插件,但没想到怎么跟swiper结合使用,就自己写了个 ...
[转]HTTP请求模型和头信息参考
[转]HTTP请求模型和头信息参考参考: http://blog.csdn.net/baggio785/archive/2006/04/13/661410.aspx模型: http://blog.csdn.net/baggio785/archive/2006/04/13/ ...
手机端H5 header定义样式
2017-01-17 00:00:15

手机端H5 header定义样式

<meta content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/> <met ...
Flexible 弹性盒子模型之CSS justify
实例在弹性盒对象的 <div> 元素中的各项周围留有空白:div{display: flex;justify-content: space-around;}复制效果预览浏览器支持表格中的数字表示支持该属性的第一个浏览器的版本号。紧跟在 -webkit-, -ms- 或 ...
标签a的注意事项1
2017-01-16 12:00:09

标签a的注意事项1

使用a标签时,其子元素可以为其他元素,但是不能包含<a>标签,否则会造成布局改变!因此请尽量不要在a标签里放太多子元素,可以在外层套一个div,其他子元素放在a标签同级下。正确布局:<div>  <a>    <span>我是a中的 ...
CSS3特性修改(自定义)浏览器默认滚动条
前言:我们做前端时,会遇到一些需求,要求把默认浏览器的滚动条样式给改写了,诶。好好的改它干啥了,也带不来用户体验,就是好看点嘛!实现原理其实是用了伪元素,webkit的伪元素实现很强,可以把滚动条当成一个页面元素来定义,再结合一些CSS3属性,比如圆角、渐变、rgba等等。最常见 ...
es6笔记2^_^array
2017-01-16 00:00:25

es6笔记2^_^array

一、Array.from()  Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)。if(1){ let list = document.quer ...
win10的IIS配置
2017-01-15 12:00:08

win10的IIS配置

安装IIS:控制面板---程序---启用或关闭windows功能---Internet Information ServicesIIS 和 IIS 可承载的web核心 有何区别? 是否两个都必须勾选才可以建立web服务器?前者就是IIS , 基础服务; 后者是 ...
Microsoft Edge与Google Chrome那些不同的举止
以下针对14393版本Edge与Chrome 54html dom/select的如果options里没有符合的值时edge会选择第一个,chrome(54)会置空选项html dom/input[type=date]如果设置了高度,那么控件里的上下箭头会居上对其,其它子控件会正 ...
HTML5的文档结构
2017-01-15 00:00:12

HTML5的文档结构

HTML5的文档结构  HTML5简化了许多,它的设计遵循了3个原则:1.兼容性、2.实用性、3.通用访问性 1. header 元素 <header> 标签定义文档或者文档的一部分区域的页眉,又可用于设置文章标题。 < ...
在网页中嵌入多媒体内容
第10章 在网页中嵌入多媒体内容现在在制作网页时,除了可以在网页中放置文本、图片外,还可以在页面中嵌入声音、视频、动画等多媒体内容,使得页面看上去更加丰富多彩、动感十足。10.1 设置滚动字幕<marquee>属性 属性值 ...
利用HTML5的devicemotion事件实现手机摇一摇抽奖,年会抽奖
摇一摇JS脚本逻辑:接下来是移动端JS脚本逻辑的实现,摇一摇的实现需借助html5新增的devicemotion事件,获取设备在位置和方向上的改变速度的相关信息,该事件的基本使用如下:if (window.DeviceMotionEvent) { window.addEvent ...
第一页下一页12345678910下10页末页第1/190页,总共:11400条数据