- 博客(23)
- 收藏
- 关注
原创 某人专用教程 (1-5)总结
列一下前5天的知识点,看看你还记得不: 第一天:理解结构与表现分离。html做什么。css做什么。JS做什么。你是否能够用自己的语言表述一下呢? 第二天:关键词——doctype。还记得是神马东西么?还有就是,标签的基本规则。。。 <ul><div><li>... 这种是错误的。。记得吧? 第三天:css怎么写,不用我...
2012-01-07 02:05:34 104
原创 某人专用教程(第5天)—— 两列布局(1)
今天开始说2列布局吧。 仍然分为html与css两部分来讲。 html部分仍然非常简单。就是下面这个两层div的结构。其中,外层用一个class叫做content包裹起来。内侧有2个容器,分别叫做left和right。 <div class="content"> <div class="left"> left box </d...
2012-01-07 01:14:43 123
原创 某人专用教程(第4天)—— 开始布局
今天就正式开始写代码了。 额。。hello world不用讲了吧? 我们直接开始写一些布局。 第一个是单栏布局。也就是只有一行的布局。这种布局一般有2种情况。一种是定宽度的。比如宽为800px,另一种是100%宽度的俗称自适应浏览器宽度。 不管哪种形式,单栏布局,就是相当于把所有内容放在一个容器内。一般,这种纯作为布局容器使用的情况下,我们都使用div标签。 ...
2012-01-04 11:11:01 93
原创 某人专用教程(第3天)—— CSS基础
今天讲讲css的基础。先来回顾下昨天的内容。html展示给用户的是一堆数据。css是为了让这些数据展示的更漂亮一些。css可以做的事情: 定义布局。包括左右结构啊,左中右结构之类的。定义元素样式。比如文字的颜色,背景色,背景图之类的。定义元素与元素之间的边距。比如内边距,外边距。 css的基本语法是: 选择器{ 属性1: 属性值1; 属性2: ...
2011-12-30 22:05:46 86
原创 某人专用教程(第2天)—— 关于HTML基础
今天开始正式编码了。。怎么装dw应该不用我教你了。我相信你有的。 反正打开dw,创建一个新html文件。如果你在欢迎面板上点击的创建,最近这几个版本的dw,都会默认新建个xhtml1.0的文件。 关于Doctype,你随便网上搜这个关键字,就能找到一大堆文邹邹的内容。这种玩意我就不讲了。自己搜下。基本就是说它告诉浏览器按照什么规范来解析页面。大概这样的。 反正我里经过的几个...
2011-12-29 22:45:18 75
原创 某人专用教程(第1天)——理解前端
一般的教程都从什么http协议啊,html历史啊开始讲的。不过这些都是p话。会做才是最重要的。历史都过去了,未来还没有来。html5,css3神马的,暂时也不要好奇哦~~ 第一天,咱们先试着理解一些基础概念吧。一张白纸的第一笔,千万表跑偏了。 这里指的前端,通俗点儿讲,就是HTML、CSS、JS 三种代码。这三种代码,就是以.html,.css,.js结尾的三种文本文件。随便找个编...
2011-12-29 00:11:12 74
html与css架构的一点体验
css本身,可以说是一门非常简单而容易入门的语言。制作一个页面,或者制作一个小企业站,对于css的要求都是非常低的。只要熟悉语法,通过英文单词的含义猜,都基本可以拼出一套样式。更何况市面上还有各种各样的辅助软件。 如果是一个比较大的网站,对css架构的要求就会相对高一些。比如,有一些可以公用的部分,可以提取出做模块。这个就是所谓的模块化。 模块化有什么优点呢? 在不去goo...
2011-12-19 23:14:57 124
原创 canvas 接粉丝游戏研究(v0.2)
新鲜出炉的v0.2版本………… 1,html代码,增加了积分器的div~~为了布局,在外面套了个壳·~就是#gameBox<div id="gameBox"> <canvas id="canvas" width="350" height="430"></canvas> <div id="score&qu
2011-03-23 01:18:16 74
原创 canvas 接粉丝游戏研究(v0.1)
v0.1 版本实现功能:1,canvas中调用一张固定url的粉丝头像,完成头像从上到下的位置移动。2,绘制“箩筐”(用来接头像的方块),完成“箩筐”的跟随鼠标移动事件。3,基础碰撞检测。 首先在HTML中书写canvas标签<canvas id="canvas" width="350" height="430"></canvas> 1...
2011-03-20 18:58:30 105
纯css实现小图片在大容器内水平垂直居中resize
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><
2010-09-25 18:53:12 127
原创 HTML5 画的小浪 代码
<!DOCTYPE HTML><html> <head> <title>A canvas moveto example</title> </head> <body> <div> <canvas id="t
2010-08-05 10:24:34 85
功能很低级的表格动态添加删除行
表格动态添加删除行。很初级的版本,很久了。自己存档下。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/x...
2010-05-21 01:46:20 116
神奇的IE bug —— input/text外层浮动+边距导致二倍边距
这个问题比较麻烦,bug是这样产生的。input/textarea的外层是block形式的容器,这个外层容器同时拥有float和margin-left/rmargin-right属性时候,会在margin的一边产生双倍边距。其中一部分是真正我们要的margin,另一部分说不出什么,看起来可以算是与margin等宽的padding。举一些例子<!DOCTYPE html PUBLIC ...
2010-05-21 01:30:43 114
原创 Demo - Clear Initial Tip Text (V0.1)
版本号:V0.1调用方法:initValue("id","initial text"); id -- input/textarea 的idinitial text -- 初始提示文字.c_txt 可以用于代表初始化文字的颜色。缺陷:使用class name作为判断依据…………不好。没加trim去空格。代码:<!DOCTYPE html PUBLIC ...
2010-05-21 00:31:15 74
原创 关于css sprites
css sprites的利弊 关于这项技术的利弊,网上说法众多。估计我也只是其中之一。关于这项技术,最大的好处有下面几个:1,减少网页加载时的http请求数。这种情况貌似只适用于“初次加载”之类需要重新从服务器端获取资源的情况。但无论怎样,对于一个流量较大或者频繁被“重新加载”的网页,还是很有用的。2,给链接做背景图时,可以防止a:hover 时再载入背景图片而导致的背景“闪烁...
2010-05-17 18:27:48 89
自己搜集常见浏览器bug
1,IE6下,由于浮动导致双倍边距问题。主要产生于横向排列的商品列表中。解决方案,将产生双倍编剧的元素定义属性 _display:inline; 2,内联样式元素后有空格时,右侧及下侧各产生3px边距问题。主要发生于图文混排的情况。解决方案,内联元素后如不希望出现3px边距,则在后面不出现空格和tab/回车等符号,直接接下一个元素标签。如出现回车,则将产生IE下3px边距仍存在,而其他浏览器下3p...
2010-05-13 17:28:56 116
原创 IE bug ——input 外层浮动的边距问题
2010-05-21 半年前的版本还是有问题。。存档 这个问题比较麻烦,bug是这样产生的。input/textarea的外层是block形式的容器,这个外层容器同时拥有float和margin-left/rmargin-right属性时候,会在margin的一边产生双倍边距。其中一部分是真正我们要的margin,另一部分说不出什么,看起来可以算是与margin等宽的padding。
2009-11-11 13:26:00 1660
原创 jquery二级树形菜单(test)
jquery二级树形菜单<!--body{margin:50px;font-family:Arial, Helvetica, sans-serif;}ul{margin:0;padding:0;}li{list-style:none;}#menuTree{background-color:#e5e5e5;width:180px;}#menuTree h3{b
2009-05-12 15:37:00 3596 2
原创 table中的添加删除行操作
<!--th{background-color:#00CCFF;text-align:left;padding:2px 12px;}td{background-color:#eee;border-bottom:1px solid #ccc;padding:2px 12px;}.mart_20{margin-top:20px;}-->th{background-c
2009-05-09 16:50:00 442
原创 yahoo 某个confirm的mask设计
之前一直觉得即使自己重新设计一个confirm模板,也是在页面正中间弹出一个。今天突然一下子发现了另外一种方法。confirm焦点移动的距离很小。。。。瓦咔咔。。。好东东呀。。。
2009-05-06 18:15:00 257
原创 雅虎密码强度验证
注册雅虎,关键是据称雅虎的用户体验很好。。刚好亲身体验一次。哈哈。 很简单的问题:密码强度认证。自用小贴士。有时候想起来逻辑很简单,大家好像都这么用的。 如图所示,绿色框框里当然就是密码强度了。分四个级别,显示很清楚。 逻辑据我判断应该是: 密码为空:0个高亮色块。密码小于6位:1个高亮色块。密码大于等于6位分很多种情况。密码为全数字或者全英文字幕
2009-05-06 17:16:00 1066
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人