切图练习以备以后修改

切图练习以备以后修改
图片:http://www.siyuweb.com/qietu/hanneng.png 案例:http://www.siyuweb.com/qietu/hanneng/index.html 参考: http://www.hanergy.com/ 图片:http://www.siyuweb.com/qietu/batie02.jpg 案例: http://www.siyuweb.com/qietu/batie02/index.html 图片:http://www.siyuweb.com/qietu/batie03.jpg 案例: http://www.siyuweb.com/qietu/batie03/index.html

手机页面上的图片尺寸要如何确定?

手机页面上的图片尺寸要如何确定?
手机分辨率是640960,但页面渲染下来的实际像素是320480。 但是页面设计稿是基于640*960做的,这样页面的一张切图就会是400实际像素宽,放在页面上大于了手机能否渲染出来的页面。 那么,这种页面在切图的时候,是否说是应该将设计稿的尺寸/2? 还是说应该把图片按比例强制为页面实际像素宽度? 貌似这两种情况都不太适合啊   http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html htt...

将图片的说明显示在图片之上且背景半透明效果

将图片的说明显示在图片之上且背景半透明效果
1.给文字增加绝对定位 <style type="text/css"> body { text-align: center; font-family:Verdana; font-size:14px; } .img-demo { position: relative; display: block; height:500px; width: 335px; margin: 0 auto; } .img-demo cite { background: #333; -moz-opacity:.50; filter:alpha(opacity=50); opacity:.50; color: #fff; position: absolute; bottom: 0; left: 0; width: 335px; pad...

css初始化代码

css初始化代码
/* css reset www.admin10000.com */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin:0; padding:0; } body { background:#fff; color:#555; font-size:14px; font-family: Verdana, Arial, Helvetica, sans-serif; } td,th,caption { font-size:14px; } h1, h2, h3, h4, h5, h6 { font-weight:normal; font-size:100%...

js的 new image()

js的 new image()
API地址: https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement 下面来看看Image到底是个什么东东,我先将Image在W3C的标准地址贴出来 http://dev.w3.org/html5/spec-preview/the-img-element.html#dom-image Three constructors are provided for creating HTMLImageElement objects (in addition to the factory methods from DOM Core such as createElement()): Image(), Image(wid...

JavaScript 仿苹果桌面dock效果

JavaScript 仿苹果桌面dock效果
Apple 的 Mac,有一种桌面快捷方式,是放到一排dock栏里的,很多window机器美化的时候,也使用了这样的方式。我们可以用 JavaScript 模拟一个桌面效果的dock。 原理: 鼠标滑入滑出的时候,dock图标会变大。鼠标距离某个图标越近,图标变得越大。因此,可以计算出鼠标距离每一个图标的距离。根据这个距离比例,相应的改变图标的大小。 1.求距离公式 求两个元素之间的距离。用到了三角勾股定理。c2 = a2 + b2...

运动框架

运动框架
// 获取元素当前样式 function getStyle(obj, sStyle, sValue) { //传参后 a等价于 arguments[0] if (arguments.length == 2) { if (obj.currentStyle) { return obj.currentStyle.sStyle; } else { return getComputedStyle(obj, false)[sStyle]; } } else if (arguments.length == 3) { obj.style[sStyle] = sVal...

JavaScript通过class获取元素

JavaScript通过class获取元素
JavaScript通过class获取元素 /*在javascript中用className来获取元素的class,但实际中最好把它封装成一个方法方便以后我们二次利用。 第一种:*/ <div class="box">第一个box</div> <div class="box">第二个box</div> <div class="box">第三个box</div> /*第二种:*/ <div class="box aa bb">第一个box</div> <div class="box dd">第二个box&...

火狐上getComputedStyle获取borderWidth返回值为空字符串

火狐上getComputedStyle获取borderWidth返回值为空字符串
用getComputedStyle在火狐上获取borderWidth时,是获取不了的, border并非一个属性,你定义的border:20px solid #000,实际上是被解释为: borderleftwidth:20px;borderleftcolor:#000;borderleftstyle:solid;.... 因为一个div有四条边,每条边的样式(如宽度,颜色等)都可能不同,所以在引用时需要确切地指出是哪个边。 因此这里应该这么写: {alert(getStyle(oDiv, 'borderLeftWidth'))} 由于你每条边...

document.createElement()的用法

document.createElement()的用法
分析代码时,发现自己的盲点——document.createElement(),冲浪一番,总结了点经验。   document.createElement()是在对象中创建一个对象,要与appendChild() 或 insertBefore()方法联合使用。其中,appendChild() 方法在节点的子节点列表末添加新的子节点。insertBefore() 方法在节点的子节点列表任意位置插入新的节点。   下面,举例说明document.createElement()的用法。<div id="board">...
Copyright © web前端技术开发个人博客 保留所有权利.   Theme  Ality

用户登录