×

Wordpress前端

分享和交流前端开发相关技术和内容。
优畅主题 2014-09-09 17:17 6,040℃ 0 条
 0 

1.标准浏览器方法: * {margin:0;padding:0} div {  width:500px;  height:500px;  border:1px solid #ccc;  overflow:hidden;  position:relative;  display:table-cell;  text-align:center;  vertical-align:middle  } div p {  position:static;  +position:absolute;  top:50%  } img {  position:static;  +position:relative;  top:-50%;left:-50%;  width:276px;  height:110px  }   <div><p><img src="http://www.idods.com/images/l…

阅读全文 >>
优畅主题 2014-09-09 17:13 6,692℃ 0 条
 0 

今天优畅和大家来谈谈怎么实现这样一个功能。其实很简单的。不管是换颜色和主题,原理都是一样的,即通个调用不同的CSS来替换掉当前的CSS而实现的; 就上面这个来说: 首先,它有个默认的style.css文件,这个CSS只负责整体的布局,不汲及颜色大小这些原素。然后会有5个CSS[a.css\b.css\c.css\d.css\e.css]文件,每个是一种风格。 默认情况下,载入的是style.css和a\b\c\d\e.css其中的一个,例如,默认情况下载入是style.css和a.css。这样就一种风格,当点击第二种后,b.css文件中的ID…

阅读全文 >>
优畅主题 2014-09-09 17:07 8,779℃ 0 条
 0 

大家都知道连续的英文或数字能是容器被撑大,不能根据容器的大小自动换行,优畅今天和大家聊聊,使下面是 CSS如何将他们换行的方法! 对于div 1.(IE浏览器)white-space:normal; word-break:break-all;这里前者是遵循标准。 #wrap{white-space:normal; width:200px; } 或者 #wrap{word-break:break-all;width:200px;} <div id="wrap">ddd111111111111111111111111111111</div> 效果:可以实现换行   2.(Firefox浏览器)white-space:normal; word-break:break-a…

阅读全文 >>
优畅主题 2014-09-07 21:21 5,476℃ 0 条
 0 

访问百度百科时,看到侧边固定的百度分享,顺手巴拉下来,说不定哪天用上,分享一下。 在网页的 </body> 前面添加下面的代码(请修改 12 行的 uid 为自己的): <div id="bdshareside"> <div id="bdshare" class="bdshare_t bds_tools get-codes-bdshare"> <div class="shareLogo"></div> <div class="shareIcon"> <a class="bds_qzone" title="分享到QQ空间" href="#"></a> <a class="bds_tsina" title="分享到新浪微博" …

阅读全文 >>
优畅主题 2014-09-07 19:33 7,378℃ 0 条
 0 

今天要跟大家分享的是一个流体布局的下拉菜单。主要的设计思路是:在菜单中往往会有很多内容或者有多个层次的子菜单,为了更加简洁和节省空间,在这个下拉菜单中将每个子菜单都隐藏在一个主导航按钮下方,当点击的时候通过细微的动画显示出来;当再次点击层级菜单时,可以再次以不同形式的动画展示下一级菜单。因为此菜单是流体布局的,所以可以很容易的适应于响应式布局当中。 HTML结构代码 菜单的结构包含一个无序列表,可以有任意数量的子列表: <div id="dl-menu" class="dl-m…

阅读全文 >>
优畅主题 2014-09-07 19:04 8,755℃ 2 条
 0 

今天优畅给大家介绍一个纯CSS写的星星评分展示效果。主要是 border 的一个非常巧妙的实际运用,非常不错,很值得学习。先看下演示效果吧。 HTML结构代码 <div class="rating rating-1"> <i class="star-1">★</i> <i class="star-2">★</i> <i class="star-3">★</i> <i class="star-4">★</i> <i class="star-5">★</i> </div> <div class="rating rating-1-half"> <i class="st…

阅读全文 >>
优畅主题 2014-09-04 09:50 2,713℃ 0 条
 0 

很早就遇到过这么个小问题,但由于其并未影响到实际作用和美观就没有正面解决它,现在,我们来试着解决它。 写一个Button,有两种方式:其一,直接button标签;其二,input type=”button”。 不管哪种方式,Button的宽度在IE6、7下总是不能完美,接下来我们演示一个普通的Button,你可以用IE6或者IE7浏览器看看其显示宽度,然后对比Chrome或者IE8等浏览器,你会发现Bug的所在。 1、一个普通的Button: 可以很直接的看到Button的两边有空隙,当然,这个空隙是无法用padding:0来解决的。 …

阅读全文 >>
优畅主题 2014-09-02 13:45 3,366℃ 0 条
 0 

type=button 就单纯是按钮功能 type=submit 是发送表单 但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性: 使用submit后,页面支持键盘enter键操作,而很多WEB软件设计师,可能没有注意到submit统一 用button后往往页面不支持enter键了。所以需要支持enter键,必须要设置个submit,默认enter键对页面第一个submit进行操作。 <input type="submit" name="b1" value="提交" onClick="bt_submit_onclick()"> 执行完onClick,转到action。可以自动提交不需要onCli…

阅读全文 >>
优畅主题 2013-02-17 18:01 4,370℃ 0 条
 0 

如果你是第一接触WordPress插件,或者说初次使用WordPress建站,建议您看下这篇文章。 WordPress建站非常方便,如果你还没有安装Wordpress系统,请见《WordPress建站第一步:安装WordPress系统》,然后再来学习如何安装Wordpress插件。 安装Wordpress插件有2种方法: 主题安装方法1、通过Wordpress后台安装Wordpress插件 点击后台左侧【插件】进入主题管理界面 点击上方【安装插件】进入主题安装界面 点击【上传】,选择Wordpress插件压缩包(注:.zip格式),点击【现在安装】按…

阅读全文 >>

切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

切换登录

注册