web前端
想旅游咯
哈哈哈哈
展开
-
中文版Chrome浏览器不支持12px以下字体的解决方案
中文版Chrome浏览器不支持12px以下字体的解决方案Chrome 27之前的中文版桌面浏览器会默认设定页面的最小字号是12px,英文版则没有限制,主要是因为chrome认为汉字小于12px就会增加识别难度,尤其是中文常用的宋体和微软雅黑。而我们在实际项目中,对于数字/英文内容,其他字体的文本可能会有特殊的需求要求它们以更小的字号来显示,这个时候就需要取消浏览器的自动调整功能了。原创 2015-01-24 20:55:10 · 521 阅读 · 0 评论 -
CSS3元素闪烁效果
@-webkit-keyframes twinkling{ /*透明度由0到1*/ 0%{ opacity:0.1; /*透明度为0*/ } 100%{ opacity:1; /*透明度为1*/ }}@keyframes twinkling{ /*透明度由0到1*/ 0%{ opacity:0.1; /*透明度为0*/ } 100%{ opaci原创 2015-01-26 21:48:46 · 569 阅读 · 0 评论 -
DIV布局如何正确的使用 id 和 class
按照字面的意思,id是指一个元素在整个文档中的“唯一标志”,而class则是它所属的“类别”。按照语法,同名的id在一个文档里只应该出现一次,而class名可重复使用。但是在具体使用的时候,哪些样式该用id,哪些样式改用class呢?有个答案很简单:那些只会在页面中出现一次的元素应该用id来表示。比如页头(header) 页尾(footer),导航菜单(main-menu)等。但是原创 2015-01-26 21:52:51 · 9579 阅读 · 1 评论 -
如何控制表单控件中的disabled
0.前言 本文主要说明如何使能或禁止表单控件。表单控件具有disabled属性,通过设置该属性可以禁止所有的input控件,input的更多属性请参考资料【1】。下面就通过一个简单的例子说明如何设置和读取disabled属性。【示例页面——代码】[html] view plaincopy> html>原创 2015-01-26 22:09:51 · 831 阅读 · 0 评论 -
Jquery.KinSlideshow演示导航
默认设置效果自定义切换参数效果自定义外观参数效果这是标题三123456兼容IE6/IE7/IE8/IE9,FireFox,Chrome*,Opera的 jQuery. KinSlideshow幻灯片插件,功能很多 ,基本能满足你在网页上使用幻灯片(焦点图)效果。Kin原创 2015-01-26 19:54:05 · 787 阅读 · 0 评论 -
超酷HTML5环形音乐播放器
这款HTML5环形音乐播放器不但很酷,而且可以自定义播放列表,用户可以选择音乐来播放。实现起来也非常简单,大家可以下载学习一下。在线演示源码下载来源地址:http://www.phpchina.com/archives/view-43460-1.html原创 2015-01-26 20:00:22 · 333 阅读 · 0 评论 -
智能表单(form),使排版更加方便
form表单学习笔记 <!-- 在旧版的html中,form表单与input等元素必须嵌套使用,为了排版方便,在html中提出了新方法 表单的多个内容不必非得放到一块,为前台美工提供了很大的方便--> 邮箱 : 用户名:原创 2015-01-26 21:47:26 · 653 阅读 · 0 评论 -
HTML-embed标签详解
Embed(一)、基本语法:embed src=url说明:embed可以用来插入各种多媒体,格式可以是 Midi、Wav、AIFF、AU、MP3等等, Netscape及新版的IE 都支持。url为音频或视频文件及其路径,可以是相对路径或绝对路径。示例:(二)、属性设置:1、自动播放:语法:autostart=true、false说明:该属性规定原创 2015-02-03 19:53:32 · 317 阅读 · 0 评论 -
网站开发流程
需求分析1. 了解需求 (出需求文档);2. 确定域名, 品牌词 ;3. 静态内容结构规划 (草图);4. 确认需求和草图 ;美工设计 1. 重新分析获得的需求,根据需求调整设计 ;2. 根据设计和站点结构制作静态站点效果图 ;3. 演示、反馈 、 确认 ;开发阶段原创 2015-02-04 20:06:18 · 417 阅读 · 0 评论 -
CSS3阴影 box-shadow的使用和技巧总结
text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果。随着html5和CSS3的普及,这一特殊效果使用越来越普遍。基本语法是{box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor}对象选择器 {box-shadow:[投影方式] X轴偏移量 Y轴偏移量阴影模糊半径原创 2015-01-24 20:47:12 · 287 阅读 · 0 评论 -
解决list-style-image图片不居中一种方式
ul li{ text-indent:15px; /*文字缩进15个像素,不然压到图表了*/ background-image:url("../images/icon.gif"); /*图片的url地址*/ background-position:left 45%; /*背景图片的定位*/ background-repeat:no-repeat; /*禁止图片平铺原创 2015-01-24 20:52:04 · 975 阅读 · 0 评论 -
html5结合flash实现视频文件在所有主流浏览器兼容播放
由于html5的出现,让网页中的视频、音频有了更加便捷的实现方式。但是video、audio标签只在IE 9+、Safari 3+、FireFox 4+、Opera 10+、Chrome 3+的浏览器版本得到了支持,并且各浏览器对于视频编码格式的支持不一致,这就需要我们考虑一个综合的实现方案,使得视频在不同浏览器中都能顺利播放,而且在老版本的浏览器中也能得到支持。以下是结合项目经验,总结出原创 2015-01-24 21:04:10 · 1878 阅读 · 0 评论 -
盘点8种CSS实现垂直居中水平居中的绝对定位居中技术
Ⅰ.绝对定位居中(Absolute Centering)技术我们经常用margin:0 auto来实现水平居中,而一直认为margin:auto不能实现垂直居中……实际上,实现垂直居中仅需要声明元素高度和下面的CSS:.Absolute-Center { margin: auto; position: absolute; top: 0; left: 0; bottom: 0原创 2015-01-24 21:14:57 · 346 阅读 · 0 评论 -
CSS透明opacity和IE各版本透明度滤镜filter的最准确用法
CSS3的透明度属性opacity想必大家都已经用的无处不在了。而对于不支持CSS3的浏览器如何进行透明处理,保持浏览器效果的一致,这个估计谁都会写,但是涉及到filter的具体语法含义和各版本写法的不同区别,很多人都搞不准确,我曾经问过许多群里的大牛,说的都不是很准确,网上的说法就更五花八门了。今天呢,主要是重新温习一下这个属性,并实际测试来说明正确的写法,和IE各版本的支持度和书写区别。原创 2015-01-25 12:25:32 · 362 阅读 · 0 评论 -
CSS背景图像位置属性background-position百分比详解
百分比值同关键字很接近,但其操作方式不一样。用百分比值来居中一幅背景图像,也很简单: body { background-image;url(beijing.gif); background-repeat:no-repeat; background-position:50% 50%; } 这使得背景图像的中心同其父元素中心对齐。换句话说,百分比值同时应用于元素及其背景图原创 2015-01-25 12:24:11 · 1846 阅读 · 0 评论 -
jquery实战9:高级特效倒计时效果
jquery实战9:高级特效倒计时效果 Document *{margin:0px;padding:0px;font-family:"微软雅黑";}.main{width:400px;height:400px;background:black;border:4px solid #ccc;margin:100px转载 2015-06-06 12:11:09 · 839 阅读 · 0 评论 -
jquery实战8:高级特效瀑布流效果
jquery实战8:高级特效瀑布流效果 Document *{margin:0px;padding:0px;} #pbl{width:900px;height:10px;background:red;margin:0px auto;position:relative;} ul li{list-s转载 2015-06-06 12:11:51 · 287 阅读 · 0 评论 -
juery实战5:封装表单验证插件+正则表达式验证器
juery实战5:封装表单验证插件+正则表达式验证器 //alert(0);//测试js是否安装成功/*(function($){//alert(123);//测试插件能否引用到//插件的入口$.fn.lmjValidate=function(options){};//固定格式的入口方法,用于调用第二部分的具体的实现方法。$.fn.lmjValidate.m转载 2015-06-06 12:12:51 · 668 阅读 · 0 评论 -
juery实战4:封装拖拽插件
juery实战4:封装拖拽插件 /* $(function(){ //$(function(){};相当于javascript中的onloading;页面加载完成的时候就执行的函数, $(".tmui-box").tmDrag(); //根据类名找到对应的元素调用插件中封装的方法tmDrag()即可进行拖拽 }); bootcss jqueryUI easyUI d转载 2015-06-06 12:13:29 · 284 阅读 · 0 评论 -
讲项目实战:网站会员功能开发+登录/注册表单
#31讲项目实战:网站会员功能开发+登录/注册表单 一、安装插件wp-user-frontend-pro二、新建注册表单+登录表单1,、找到后台菜单:用户前端化-注册表单-Add Form三、新建表单字段介绍(见效果图:新建标段 字段)四、注册和登录表单相关参数设置1.找到后台菜单:用户前端化-设置-注册登录五、新建注册登录页面1.找到后台菜单:页面转载 2015-06-06 12:15:33 · 1234 阅读 · 0 评论 -
25讲项目实战:自定义菜单插件+添加文章+自定义字段插件
#25讲项目实战:自定义菜单插件+添加文章+自定义字段插件 一、注册菜单1、在模板文件下新建 functions.php文件,然后在里面加上注册菜单代码 register_nav_menus(array( 'MainNav' => '主导航', 'LogoNav' => '菜单导航', ));?>调用代码: 'Main转载 2015-06-06 12:19:27 · 485 阅读 · 0 评论 -
24讲项目实战:后台登录界面更换、站点栏目分类
#24讲项目实战:后台登录界面更换、站点栏目分类 后台添加网站分类目录共五个顶级栏目:别名只能用英文字母 二级,三级栏目的添加同上 各级栏目建好后,给各级栏目添加超链接的页面。 超链接的地址如下图:没有web文件夹的写为?/cat 栏目的超链接地址是根据各个栏目的ID进行跳转的。栏目页面的图片地址,js地址,和css引用地址的更改。转载 2015-06-06 12:20:21 · 335 阅读 · 0 评论 -
jquery实战1:鼠标右击事件,回到顶部特效
jquery实战1:鼠标右击事件,回到顶部特效 标题 *{margin:0px;padding:0px;} body{width:100%;height:900px;background:url("images/bg.jpg") no-repeat center;} #coniter{}转载 2015-06-06 12:22:59 · 842 阅读 · 0 评论 -
jQuery基础总结3
jQuery基础总结3 jQuery 构造器构造器是jQuery框架的内核(core),它犹如JavaScript语言的构造函数(Function) 。构造器由jQuery()函数(可简写为$())负责实现,该函数是整个jQuery框架的核心,jQuery中的一切操作都构建于这个函数之上。jQuery()函数可以接收四种类型的参数:jQuery(expres转载 2015-06-06 12:23:45 · 412 阅读 · 0 评论 -
21讲项目实战CMS-wordpress主题网站模板制作
#21讲项目实战CMS-wordpress主题网站模板制作 1、如何新建主题模板 找到文件夹wamp->www->wp-content->themes,然后在这里面新建 一个文件夹(名字自己取),把我们开发好的静态网站放到这个里面2、一个完整的网站模板要具体以下条件 a)、index.php 首页模板 style.css 样式文件转载 2015-06-06 12:27:26 · 1952 阅读 · 0 评论 -
20讲后台准备实战wordpress及wampserverWeb服务器PHP解释器安装调试-域名和空间介绍
#20讲后台准备实战wordpress及wampserverWeb服务器PHP解释器安装调试-域名和空间介绍 安装wampserver后浏览器输入http:\\127.0.0.1或 http://localhost 安装成功后的界面自定义的数据库 此处默认有5张表 数据库名称 root为默认用户名密码为空 注意此处的用户名必须是默认的ROOT权限转载 2015-06-06 12:29:32 · 386 阅读 · 0 评论 -
19讲项目实战站内搜索页
#19讲项目实战站内搜索页 $(document).mousewheel(function(event, delta, deltaX, deltaY)通过参数delta可以获取鼠标滚轮的方向和速度。如果delta的值是负的,那么滚轮就是向下滚动,正的就是向上。 deltaX, deltaY分别是滚轮滚动的坐标值event是滚轮的事件,是滚动还是点击等。JS转载 2015-06-06 12:31:02 · 701 阅读 · 0 评论 -
javascript事件冒泡详解和捕获、阻止方法
javascript事件冒泡详解和捕获、阻止方法一、事件的发生顺序这个问题的起源非常简单,假设你在一个元素中又嵌套了另一个元素代码如下:-----------------------------------| element1 || ------------------------- ||转载 2015-06-06 12:35:04 · 588 阅读 · 0 评论 -
16讲项目实战详细页制作及与首页和内页的链接添加
#16讲项目实战详细页制作及与首页和内页的链接添加 /*风景详细页-----第一部分样式*/#Deltail_part1{width:950px; height:500px; margin:15px auto 25px;}#Deltail_part1 .Deltail_part1_L{width:420px; height:500px; float:left;}#Delt转载 2015-06-06 12:38:02 · 1766 阅读 · 0 评论 -
JS原型+构造函数创建对象
JS原型+构造函数创建对象 JavaScript对象的创建方式在JavaScript中,创建对象的方式包括两种:对象字面量和使用new表达式。对象字面量是一种灵活方便的书写方式,例如:?123456var o1 = { p:”I’m in O转载 2015-06-06 12:39:14 · 1139 阅读 · 0 评论 -
css3+jquery仿win7开机效果
css3+jquery仿win7开机效果 仿WIN7开机效果 *{margin:0px;padding:0px;} a{width:64px;height:64px;background:url("images/1.png");display:block;margin:120px auto;} a:ho转载 2015-06-06 12:40:02 · 828 阅读 · 0 评论 -
14讲项目实战内页抽出切换效果的实现
#14讲项目实战内页抽出切换效果的实现 /*内页主体样式*/img{border:0px;}.webBody{background:#f4f4f4;}/*面包屑导航样式*/.webLogo {width:1000px; height:68px; margin:0px auto; border-bottom:2px solid #dd85b3; backgrou转载 2015-06-06 12:42:45 · 1466 阅读 · 0 评论 -
纯css3打造定时滚动效果banner及产品列表页
纯css3打造定时滚动效果banner及产品列表页 标题 *{margin:0px; padding:0px;} /*花花{身高:160cm; 体重:43kg;IQ:400;}*/ #top{width:100%; height:77px;background:#3e2b24; padding:17px 0转载 2015-06-06 12:45:31 · 3157 阅读 · 0 评论 -
13讲项目实战内页滚动图效果实现
#13讲项目实战内页滚动图效果实现内页 html代码及JS代码部分湖南海外旅游 全省免费服务热线: 96556 0731-84635555旅行社同行热线:0731-84402588 登陆 注册 首页 出境游 国内游 特价游转载 2015-06-06 12:46:48 · 786 阅读 · 0 评论 -
jquery特效-淘宝聚惠11.11效果
jquery特效-淘宝聚惠11.11效果 http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 标题 *{margin:0px;padding:0px;}#louti{width:120px; position:fixed; left:20px; b转载 2015-06-06 12:48:25 · 526 阅读 · 0 评论 -
浏览器对象模型(Browser Object Model)
浏览器对象模型(Browser Object Model) 什么是BOM?BOM是Browser Object Model的缩写,简称浏览器对象模型BOM提供了独立于内容而与浏览器窗口进行交互的对象由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是windowBOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性BOM缺乏标准,JavaScript语法的转载 2015-06-06 12:50:36 · 445 阅读 · 0 评论 -
12讲项目实战SEO之HTML代码优化-水平框架-竖直框架-混合框架-案例
#12讲项目实战SEO之HTML代码优化-水平框架-竖直框架-混合框架-案例 水平框架http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 标题 http://www.baidu.com" name="top"/>转载 2015-06-06 12:49:57 · 492 阅读 · 0 评论 -
Frame框架在Html中的应用详解
Frame框架在Html中的应用详解 FRAME(框架)是Web上经常会看到的页面结构。使用可视Web开发工具(比如Dreamweaver或者Frontpage),虽然可以在WYSIWYG环境中通过简单的鼠标托拽完成FRAME的构建,但是要实现真正细致甚至强大的功能,仔细理解FRAME的代码结构至关重要!你将发现,FRAME原来是这样的亲切易用。 创建基本的FRAMESET:转载 2015-06-06 12:53:03 · 1069 阅读 · 0 评论 -
css3仿QQ网页播放器及分享功能实现
css3仿QQ网页播放器及分享功能实现 标题 /*css样式里面注释符 px像素*/ *{margin:0px;/*外边距*/ padding:0px;/*内边距*/}/* * 通配符 代表所有的标签 */ body{background:url("img/public-bg9.jpg");/*背景图 url 图片地址转载 2015-06-06 12:53:38 · 514 阅读 · 0 评论 -
10讲项目实战首页底部固定位置的分享、咨询功能
#10讲项目实战首页底部固定位置的分享、咨询功能 1.构建一个宽度100% 高度149px 这样一个长方形,为了保证浏览器的兼容,我们加了*{margin:0px;padding:0px;}Top样式中的宽度100%也可以不写,因为浏览器已给出默认为100%宽。 2.给个长方形盒子,添加一个背景图片,背景图片默认的会沿着水平方向平铺 3.Top盒子里头部信息的构建转载 2015-06-06 12:54:36 · 2677 阅读 · 0 评论