文章列表
某人专用教程 （1-5）总结
- 博客分类：
- LC UI TEAM
列一下前5天的知识点，看看你还记得不：
第一天：理解结构与表现分离。html做什么。css做什么。JS做什么。你是否能够用自己的语言表述一下呢？
第二天：关键词——doctype。还记得是神马东西么？还有就是，标签的基本规则。。。
<ul><div><li>... 这种是错误的。。记得吧？
第三天：css怎么写，不用我说吧。记得各种选择器的优先级么？如果不太记得也没关系。如果你写了个样式木有生效，记得往这方面想就好了。看看是不是其他优先级更高的选择器将你后定义的css给覆盖掉了。
第四天：讲了个marg ...
今天开始说2列布局吧。
仍然分为html与css两部分来讲。
html部分仍然非常简单。就是下面这个两层div的结构。其中，外层用一个class叫做content包裹起来。内侧有2个容器，分别叫做left和right。
<div class="content" ...
某人专用教程（第4天）—— 开始布局
- 博客分类：
- LC UI TEAM
今天就正式开始写代码了。
额。。hello world不用讲了吧？
我们直接开始写一些布局。
第一个是单栏布局。也就是只有一行的布局。这种布局一般有2种情况。一种是定宽度的。比如宽为800px，另一种是100%宽度的俗称自适应浏览器宽度。
不管哪种形式，单栏布局，就是相当于把所有内容放在一个容器内。一般，这种纯作为布局容器使用的情况下，我们都使用div标签。
html代码是这样的
<div class="box">This is a layout box.</div>
给这个div一个class名 ...
今天讲讲css的基础。先来回顾下昨天的内容。html展示给用户的是一堆数据。css是为了让这些数据展示的更漂亮一些。
css可以做的事情：
定义布局。包括左右结构啊，左中右结构之类的。
定义元素样式。比如文字的颜色，背景色，背景图之类的。
定义元素与元素之间的边距。比如内边距，外边距。
css的基本语法是：
选择器{
属性1: 属性值1;
属性2: 属性值2;
}
其中，常用的选择器包括：
ID选择器
Class选择器
标签选择器(更文艺的说法是：派生选择器)
听起来挺文艺的。转化成普通的说法就是：
如 ...
今天开始正式编码了。。怎么装dw应该不用我教你了。我相信你有的。
反正打开dw，创建一个新html文件。如果你在欢迎面板上点击的创建，最近这几个版本的dw，都会默认新建个xhtml1.0的文件。
关于Doctype，你随便网上搜这个关键字，就能找到一大堆文邹邹的内容。这种玩意我就不讲了。自己搜下。基本就是说它告诉浏览器按照什么规范来解析页面。大概这样的。
反正我里经过的几个时代：html4 xhtml1.0和目前比较火但还不太靠谱的html5
对于html与xhtml的历史，网上也有一大堆。我也不说了。
就表现层上来说，doctype不同，同样一段css ...
某人专用教程（第1天）——理解前端
- 博客分类：
- LC UI TEAM
一般的教程都从什么http协议啊，html历史啊开始讲的。不过这些都是p话。会做才是最重要的。历史都过去了，未来还没有来。html5，css3神马的，暂时也不要好奇哦~~
第一天，咱们先试着理解一些基础概念吧。一张白纸的第一 ...
html与css架构的一点体验
- 博客分类：
- xhtml/css
css本身，可以说是一门非常简单而容易入门的语言。制作一个页面，或者制作一个小企业站，对于css的要求都是非常低的。只要熟悉语法，通过英文单词的含义猜，都基本可以拼出一套样式。更何况市面上还有各种各样的辅助软 ...
新鲜出炉的v0.2版本…………
1，html代码，增加了积分器的div~~为了布局，在外面套了个壳·~就是#gameBox
<div id="gameBox">
<canvas id="canvas" width="350" height="430"></canvas>
<div id="score">0</div>
</div>
2，css部分，没什么好说的，大概的放了个布局。
body{mar ...
v0.1 版本实现功能：
1，canvas中调用一张固定url的粉丝头像，完成头像从上到下的位置移动。
2，绘制“箩筐”（用来接头像的方块），完成“箩筐”的跟随鼠标移动事件。
3，基础碰撞检测。
首先在HTML中书写canvas标签
<c ...
<!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>
<meta http-equiv="Content-Type" content="text/html; charset ...
<!DOCTYPE HTML>
<html>
<head>
<title>A canvas moveto example</title>
</head>
<body>
<div>
<canvas id="tutorial" width="150" height="150"></canvas>
</div>
<script typ ...
表格动态添加删除行。很初级的版本，很久了。自己存档下。
<!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>
<meta http-equiv="Content-Type&quo ...
这个问题比较麻烦，bug是这样产生的。input/textarea的外层是block形式的容器，这个外层容器同时拥有float和margin-left/rmargin-right属性时候，会在margin的一边产生双倍边距。其中一部分是真正我们要的margin，另一部分说不出什么，看起来可以算是与margin等宽的padding。
举一些例子
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-trans ...
版本号：V0.1
调用方法：
initValue("id","initial text");
id -- input/textarea 的id
initial text -- 初始提示文字
.c_txt 可以用于代表初始化文字的颜色。
缺陷：
使用class name作为判断依据…………不好。
没加trim去空格。
代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xht ...