web前端
雨里去
这个作者很懒,什么都没留下…
展开
-
有关EM
看到em,不明白什么意思,找了点有用的东西,自己收着:em指字体高,任意浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em。为了简化font-size的换算,需要在css中的body选择器中声明Font-size=62.5%,这就使em值变为 16px*62.5%=10px, 这样12p转载 2012-10-26 15:56:20 · 1006 阅读 · 0 评论 -
今日小记,inline-block,absolute,
今天又翻看了鑫的博客,收获不少,记录一下1.absolute的重us原创 2014-08-06 17:14:55 · 837 阅读 · 0 评论 -
多行文字的垂直居中
My Demo 1 li{margin-bottom: 20px;width: 300px; background:#F1F5F8;} .demobox{display:table-cell;vertical-align:middle;width:140px;height:300px;} .demospan{display:inline-block;vertic原创 2014-09-19 15:28:17 · 764 阅读 · 0 评论 -
边框样式[border-style]
原创 2014-08-13 16:24:39 · 848 阅读 · 0 评论 -
display的inline-block属性
对于IE8+以及现代浏览器,直接使用:{display:inline-block;}就可以了,支持任意水平的元素。对于不支持的IE6/7浏览器该怎么办呢?如果是inline水平的元素(如a标签,span标签之类)跟上面一样,直接:{display:inline-block;}就可以了,对于这两个浏览器,其功效与*zoom:1;是一样的。如果是block水平的元素,例如li标原创 2014-08-06 17:14:21 · 942 阅读 · 0 评论 -
text-size-adjust的值为100% 代替值 none
通常 iPhone 横屏时默认会放大文字,如果页面已经做了响应式,这可能会破坏布局原创 2014-09-28 17:17:14 · 4277 阅读 · 0 评论 -
表格的隔行变色,实现方法
表格中的隔行变色,很常见,下面原创 2014-11-10 14:42:26 · 1330 阅读 · 0 评论 -
解决display:inline-block 出现的间隙
是把父DIV加上:font-size:0; 他的作用便是让多余的空白符消失,当然这会造成所有子元素的文本都一同消失,因此你需要再在子元素加一个font-size:12px。原创 2014-10-09 12:00:26 · 7536 阅读 · 0 评论 -
ul ol li的序号编号样式
列表内容列表内容列表内容列表 列表内容列表内容列表内容列表 列表内容列表 列表内容列表内容4 列表内容列表内容5原创 2014-11-18 15:14:17 · 98481 阅读 · 0 评论 -
sublime text3 搭建 nodejs开发环境
第一步:安装sublime text3第二步:安装nodejs在sublime的插件 一。获取nodejs插件SublimeText-Nodejs的方式有2种GIT方法 可直接输入 git clone https://github.com/tanepiper/SublimeText-Nodejs "D:\ProgramFiles\Sublime Text 3\D转载 2014-12-19 16:48:48 · 15329 阅读 · 2 评论 -
sublime text3 针对于前端开发必备的插件
Sublime Text 3对于前端开发的必要插件1.emmet---前身Zen coding:HTML/CSS代码快速编写神器2.jQuery Package for sublime Text3.JS FormatJS代码格式化插件4.Sublime CodeIntel 代码自动提示5.Bracket Highlighter类似于代码匹配,可以匹配括号,引号等符号内的范围原创 2014-12-19 13:28:21 · 7440 阅读 · 0 评论 -
margin 0 auto在IE8下失效
很奇怪的问题,margin:0 auto;用于水平居中不起作用了,在ie8下,其它浏览器都没问题,最后的解决办法是在body加上width:100%;text-align:center;body{width:100%;text-align:center;}就可以了不过有一点不好的地方,body下的不需要文本居中的都要设一下补充可以加上body{width:100%;text-a原创 2014-12-24 10:31:47 · 8549 阅读 · 2 评论 -
DW里的html使用正则表达式
dw的正则表达式日常使用查找替换太有用了,下面记录原创 2014-11-10 14:30:59 · 2178 阅读 · 0 评论 -
移动前端开发注意的地方
在移动端网页前端有一些需要注意的方面1.页面的加载:一个页面如果遇到加载超过5秒的手机网站,大部分的用户会选择离开。假定手机平均网速只有93K/s,就需要控制在465K以内。建议首屏加载在465K以内,剩下的按需加载或者延时加载。当然添加loading能给我们争取更多的加载时间。2.页面的层级:层级越多流失率就越高,保证页面的层级最好在2级3.滑动优于点原创 2015-02-13 14:21:28 · 1078 阅读 · 0 评论 -
mac 中配置apache的DocumentRoot路径 出现403 Forbidden错误
mac中配置apache 要将默认路径改为自己的路径DocumentRoot "/Users/username/Documents" 总是出现 403 forbidden You don't have permission to access / on this server解决方法如下,方法1.是否 DocumentRo原创 2015-09-25 13:28:31 · 18271 阅读 · 0 评论 -
问题:IE下a没有内容点不了了
浮动层的图片加个A标签,无内容原创 2014-06-13 14:24:34 · 733 阅读 · 0 评论 -
css实现文字指定位置显示,底部对齐,文字在块内的垂直对齐
CSS实现文字底部对齐 #txt{ height:246px; width:512px; border:1px solid #000000; position:relative } #txt p{ position:absolute; bottom:0px; padding:0px; margin:0px } 网页特效转载 2014-07-23 16:40:12 · 53108 阅读 · 0 评论 -
CSS布局左中右宽度固定高度自动
弄了一个上午,终于搞定了我的遇见的布局是左中右,宽度固定,左右随首中间的DIV的高度不同要有高度的变化,用表格或iframe实现很简单,但用div+css可有些麻烦,试过用JS来初始化共左中右高度,但在中间DIV高度有变化时,左右的DIV高度并不随着变,终于到了一种“隐藏容器溢出”和“正内补丁”和“负外补丁”结合的方法,主要解决的代码是在左右DIV中加入padding-bottom转载 2013-09-25 12:01:59 · 1816 阅读 · 0 评论 -
li 元素中包含 a img 元素, 图片垂直居中的解决
li 元素中包含 a img 元素并且li是浮动的float:left的其中的图片怎么也垂直居中不了,最后设置 img 为块级元素就解决了 会员登录 注册 设置 img 为块级元素.imgC{display: block;} 参考:http://www.qianduan.net/im原创 2013-01-04 16:01:31 · 21492 阅读 · 1 评论 -
AS3库资源
AS3库资源收藏起来1、as3ebaylibhttp://code.google.com/p/as3ebaylib/2、as3youtubelibhttp://code.google.com/p/as3youtubelib/3、as3flickrlibhttp://code.google.com/p/as3flickrlib/4、Yahoo转载 2013-01-24 10:29:19 · 1158 阅读 · 1 评论 -
自己总结中 css hack
类内部Hack: IE6 识别下划线 _ 和 * IE7 识别 * (不能识别 _ ) FF两个都不能识别 选择器Hack: IE6能识别 *html IE7能识别 *+html 或 *:f原创 2013-01-15 13:56:29 · 850 阅读 · 1 评论 -
css中的z-index设置999,不能完全显示出来,被盖住了
css中的z-index设置999,不能完全显示出来,被盖住了 这种情况在FF里没有,只有IE中才出现,查了查发现IE的问题 解决的主要办法是在父元素上加个z-index只要小于你设的值就行了,如z-index=1;原创 2013-01-15 13:32:25 · 8220 阅读 · 0 评论 -
DIV+CSS最小高度(兼容IE6\IE7\FF)(转载)
折腾了一上午,就是搞不定这个最小高度 min-height:的问题,因为min-height:只在IE7\FF中起作用。至于这个IE6死活就是不认。而我这个页面又必需得用这个最小高度来定。页面是二栏的左右分,左栏算是导航菜单固定不变,长约1160PX,右边是产品的详细信息且是动态的,可长可短。左右栏中间是一条1PX灰色的分隔线,就是这根分隔线倒底是定在左栏的右边框上,还是定在右栏的转载 2013-01-30 12:12:38 · 653 阅读 · 0 评论 -
jquery的淡入,淡出事件 fadeIn fadeOut
jquery的淡入,淡出事件 fadeIn fadeOut1. fadeIn() 方法使用淡入效果来显示被选元素,(该元素是隐藏的)$(selector).fadeIn(speed,callback) 参数描述speed,可选。规定元素从隐藏到可见的速度。默认为 "normal"。可能的值:毫秒 (比如 1500)"slow""normal""fast"原创 2013-01-16 13:46:22 · 13868 阅读 · 0 评论 -
收藏前端会用到的网站
1. 网站的配色一般都比较头疼,这个网站有一些配色的方案,如果有设计需求的时候可以参考 Color Combinations and Color Schemes URL:http://www.colorcombos.com/ 2. 想知道图片上的文字是什么字体吗?它会告诉你,虽然运行会有点慢吧,还有对中文不太支持,但还是值得收藏原创 2013-08-21 12:00:56 · 580 阅读 · 0 评论 -
flash总是在最前边的解决办法
使用embed的方法播放flash,无论原创 2014-06-19 09:42:31 · 1830 阅读 · 0 评论 -
解决 css 中Z-index 一直不起作用
弄了半天,只是做个小的下拉效果,如淘宝的那种,如图但在框中总是层叠不对,如下图找了半天原来只是少了一行代码:position:relative;这个放在上面的DIV中,而下拉框是绝对定位不用处理最终的解决是两个DIV如果有层叠效果必要加上注意:Z-index属性只能工作于那些被定义了position属性的元素中原创 2013-07-17 10:54:53 · 5498 阅读 · 0 评论 -
jQuery中读取json文件
json文件是一种轻量级的数据交互格式。一般在jquery中使用getJSON()方法读取。$.getJSON(url,[data],[callback])url:加载的页面地址data: 可选项,发送到服务器的数据,格式是key/valuecallback:可选项,加载成功后执行的回调函数1. 首先建一个JSON格式的文件userinfo.json 保存用户信息。如原创 2013-05-10 12:23:48 · 46353 阅读 · 0 评论 -
ie6,ie7出现的空格不会自动折行
HTML结构及CSS样式如下:li {float:left; margin-right:10px; } 文本1 文本2 文本3这个时候,在ie6、ie7中文字很可能出现断行(暂没发现其他浏览器出现这个问题)解决问题方法: 1)如果文本中没有空格,用word-break属性的keep-all参数可解决这个问题,转载 2013-09-16 11:11:09 · 1771 阅读 · 0 评论 -
针对于ie不同版本的引入相对应的css样式
根据不同浏览器的引入不同的原创 2014-07-01 11:29:55 · 1461 阅读 · 0 评论 -
禁止textarea拉伸
style="resize:none"原创 2014-01-22 10:52:01 · 150757 阅读 · 16 评论 -
jquery插件汇总
1. 翻书角效果------ jFlip 演示地址:http://www.jquery.info/scripts/jFlip/demo.html原创 2013-08-15 14:53:48 · 984 阅读 · 0 评论 -
jQery的ajax的应用
一.load()方法(最简单的)load(url,[data],[callback])url:加载的页面地址data: 可选项,发送到服务器的数据,格式是key/valuecallback:可选项,回调函数1.最简单的应用load方法应用 #divframe{ border:1px solid #999; width:500px; ma原创 2013-05-10 12:16:38 · 1329 阅读 · 0 评论 -
表格样式的cellspacing cellpadding
table中cellspacing、cellpadding的css替代写法原创 2014-07-23 16:38:47 · 1225 阅读 · 0 评论 -
CSS3相关效果整理
1.过长省略white-space:nowrap;/*为应用text-overflow做准备,禁止换行*/overflow:hidden;/*为应用text-overflow做准备,禁止文本溢出显示*/text-overflow:ellipsis;/*兼容IE,Safari(Webkit)*/-o-text-overflow:ellipsis;/*兼容Opera*/-moz-bin原创 2013-05-29 13:02:21 · 821 阅读 · 0 评论