我如何看待DIV+CSS架构(一)
+++ 每搞IT的人都知道B/S系统的DIV+CSS结构,知道它的好。但如果你问,DIV+CSS结构是什么?好在哪里?实际项目应该如何体现或实现?每个人都能和你白伙几句,有些人甚至会滔滔不绝,而往往这些滔滔不绝的人也只是听另一些滔滔不绝的人说的,仅仅是“接收”并“接受”了信息,That is all,就像一张磁盘,也许连磁盘都不如……
+++ 他们究竟对DIV+CSS结构了解多少?我比较讨厌那些狗屁不懂,却又在那夸夸其谈、口若悬河、没事糊弄人、装逼的人……可是我们身边恰恰就有很多这样的人。所以,我希望还没有多少编程经验、热心于编写代码,并希望在这个领域有所作为的你,谦恭地向身边的“高手”求教,对事物抱有一定的审视态度,并认真对待那些只会装逼的“磁盘”人。
+++ 本文及其之后的几篇文章,在不断改进的过程中,演示DIV+CSS结构。这些东西完全是自己的体会,如有不妥之处请指证。下面从一个最最简单的例子开始。
+++ 程序描述
功能很简单,根据用户输入的条件,进行检索并显示检索结果。程序的组成如下:
1) 一个自定义类Oracle.cs。Oracle.cs类位于项目的App_Code里;
2) 一个页面Default.aspx;
3) 在Web.Config文件里加入数据库链接字符串,如下:
<appSettings>
<add key="ConnectString" value="Data Source=orc11;User ID=scott;Password=tiger;Unicode=True;Persist Security Info=false;"/>
</appSettings>
+++ 页面设计
<body>
<form id="form1" runat="server">
<asp:Label ID="lbl_empno" runat="server" Text="员工编号
<asp:TextBox ID="txtc_empno" runat="server"></asp:TextBox></td>
<asp:Button ID="btn_query" runat="server" Text="检索" OnClick="btn_query_Click" />
<asp:GridView ID="gv_result" runat="server"></asp:GridView>
</form>
</body>
++ 说明
1) 页面有四个控件:Label ,TextBox,Button和GirdView。给这它们起好名字,位置无所谓。
+++ 后台代码
添加Page_Load和btn_query_Click事件。根据自定
相关文档:
动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法
对于div,p等块级元素
正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行
html
<
id="wrap">正常文字的换行(亚洲文字和非亚洲文字) ......
注:"elm"代表某个DOM元素,"xxx"代表某个CSS属性
一、elm.style.xxx 只能获取内联样式里的值
要想获得正确的css值:
IE:elm.currentStyle[xxx]
W3C标准:document.defaultView.getComputedStyle(elm,"")[xxx]
注意:用IE方法返回值可能不是数字,而是auto;用w3c的方法总是会返回数字+单位
三、offsetLeft
......
The Lovely CSS Framework is a simple and straight forward way to easily
deploy an XHTML/CSS site.
Based on a simple 960px wide grid system, featuring multiple column layouts,
and various pluggable add-ons.
这个由 Constantinos Demetriadis 创建的项目是一个 CSS 框架,基于 960.gs,还拥有一个插件 ......
盒子标签和属性对照
CSS语法(不区分大小写)
JavaScript语法(区分大小写)
border
border
border-bottom
borderBottom
border-bottom-color
borderBottomColor
border-bottom-style
borderBottomStyle
border-bottom-width
borderBottomWidth
border-color
borderColor
border-left
borderLeft
border ......