HTML+js页面横向分栏效果

<!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=gb2312" />
<title>动态网站建设与管理</title>
<style type="text/css">
html,body{100%; height:700px;}
body,td,th {font-size: 14px;}
body {margin: 0px; background:#eee; color:#666;}
a:link {color: #333;text-decoration: none;}
a:visited {text-decoration: none;color: #333;}
a:hover {text-decoration: none;color: #333;}
a:active {text-decoration: none;color: #333;}
ul,form{margin:0; padding:0; }
.clear{ clear:both; margin:0; padding:0; height:0;}

ul{300px;height:100%;text-align:left;column-count:1;column-rule:0px dotted #d8d8d8;}
ul li{ margin-left:5px;}
.list{ 92%; height:80%; margin:20px auto 0 auto; overflow:hidden; background:#fff;}
.tit1{ font-size:14px; font-weight:700; list-style:none; margin-top:10px;}
.tit2{ font-size:12px; line-height:25px; margin-left:25px; color:#999;}
.tit3{ font-size:12px; line-height:25px; margin-left:25px; color:#999; list-style:none;}
</style>
<script type="text/javascript">
window.onload = function() {
var oul = document.getElementsByTagName('ul')[0];
for(var i=0; i<9; i++){
var _li = document.createElement('li');
_li.innerText = i+1;
}
};
</script>
</head>

<body>
<div style="text-align:center; background:#333; font-size:24px; color:#fff; line-height:50px;">动态网站建设与管理</div>
<div class="list">
<ul>
<li class="tit1">第1章 ASP概述</li>
<li class="tit2">1.1 什么是ASP</li>
<li class="tit2">1.2 ASP程序的执行(IIS简述)</li>
<li class="tit2">1.3 ASP程序在Windows Vista操作系统中运行要求</li>
<li class="tit3">1.4 本章小结</li>
<li class="tit1">第2章 ASP框架语言——HTML</li>
<li class="tit2">2.1 HTML语言结构</li>
<li class="tit2">2.2 HTML非正文标记</li>
<li class="tit2">2.3 HTML正文标记</li>
<li class="tit2">2.4 HTML特殊标记</li>
<li class="tit3">2.5 本章小结</li>
<li class="tit1">第3章 ASP脚本语言——VBScript</li>
<li class="tit2">3.1 VBScript概述</li>
<li class="tit2">3.2 VBScript数据类型及运算符</li>
<li class="tit2">3.3 VBScript变量和常量</li>
<li class="tit2">3.4 VBScript常用函数</li>
<li class="tit2">3.5 VBScript语句</li>
<li class="tit2">3.6 VBScript过程和自定义函数</li>
<li class="tit2">3.7 使用VBScript对象编程</li>
<li class="tit2">3.8 综合实例</li>
<li class="tit3">3.9 本章小结</li>
<li class="tit1">第4章 ASP内置对象</li>
<li class="tit2">4.1 获取客户端数据的Request对象</li>
<li class="tit2">4.2 向客户端输出数据的Response对象</li>
<li class="tit2">4.3 应用程序会话管理</li>
<li class="tit2">4.4 服务器信息的Server对象</li>
<li class="tit3">4.5 本章小结</li>
<li class="tit1">第5章 ASP内置组件</li>
<li class="tit2">5.1 基本概念</li>
<li class="tit2">5.2 Ad Rotator组件(制作页面广告轮显)</li>
<li class="tit2">5.3 Browser Capabilities组件(侦测浏览器能力)</li>
<li class="tit2">5.4 Context Linking组件(制作在线小说)</li>
<li class="tit2">5.5 Counters与Page Counter组件(页面访问次数统计)</li>
<li class="tit2">5.6 综合实例:网页在线投票统计</li>
<li class="tit3">5.7 本章小结</li>
<li class="tit1">第6章 ASP的文件处理</li>
<li class="tit2">6.1 FileSystemObject对象</li>
<li class="tit2">6.2 TextStream对象</li>
<li class="tit2">6.3 File对象及Files集合</li>
<li class="tit2">6.4 Folder对象及Folders集合</li>
<li class="tit2">6.5 Drive对象及Drives集合</li>
<li class="tit2">6.6 综合实例:访客留言簿</li>
<li class="tit3">6.7 本章小结</li>
<li class="tit1">第7章 ASP数据库基础知识</li>
<li class="tit2">7.1 数据库基础知识</li>
<li class="tit2">7.2 创建适用于ASP程序的数据库</li>
<li class="tit2">7.3 结构化查询语言SQL</li>
<li class="tit3">7.4 本章小结</li>
<li class="tit1">第8章 ADO在ASP中的应用</li>
<li class="tit2">8.1 活动数据对象ADO</li>
<li class="tit2">8.2 连接数据库Connection对象</li>
<li class="tit2">8.3 检索数据Recordset对象</li>
<li class="tit2">8.4 增强处理能力Command对象</li>
<li class="tit2">8.5 ADO对象库的集合</li>
<li class="tit2">8.6 综合实例:用户注册登录系统</li>
<li class="tit3">8.7 本章小结</li>
<li class="tit1">第9章 常见ASP脚本攻击及防范</li>
<li class="tit2">9.1 ASP漏洞</li>
<li class="tit2">9.2 防范措施</li>
<li class="tit3">9.3 本章小结</li>
<li class="tit1">第10章 ASP技术的综合应用 一套完整的动态网站程序</li>
<li class="tit2">10.1 网站定位</li>
<li class="tit2">10.2 功能模块划分</li>
<li class="tit2">10.3 数据库设计</li>
<li class="tit2">10.4 会员注册与管理</li>
<li class="tit2">10.5 预定制商品</li>
<li class="tit2">10.6 商品陈列架</li>
<li class="tit2">10.7 用Cookies实现购物车</li>
<li class="tit2">10.8 商品检索</li>
<li class="tit2">10.9 BBS社区论坛</li>
<li class="tit2">10.10 主页设计及各模块的整合</li>
<li class="tit3">10.11 本章小结</li>
<li class="tit1">第11章 课程设计、综合测试、教学大纲</li>
<li class="tit2">11.1 课程设计 中小型网站开发能力训练</li>
<li class="tit2">11.2 上机测试题</li>
<li class="tit2">11.3 理论测试题(闭卷)</li>
<li class="tit2">11.4 教学大纲</li>
<li class="tit3">附录A VBScript函数速查表</li>
<li class="tit3">附录B 习题答案</li>
<li class="tit3">网站开发工程师模拟考试题</li>
</ul>
</div>
</body>
</html>

原文地址:https://www.cnblogs.com/ince/p/10528285.html