⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 template.html

📁 ajax快速入门,主要讲解原理与部门实现
💻 HTML
字号:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AJAX's RSS Reader</title>
<style type="text/css">
<!--
body {
	margin-left: 0px;
	margin-top: 0px;
}
h1,h2,h3{
	font-weight: normal;
	margin: 0px;
	padding: 0px;
}
#tree {
	float: left;
	width: 150px;
	overflow: auto;
	height: 530px;
	margin: 5px;
	padding: 5px;
}
#tree div,#tree span{
	cursor: crosshair;
	cursor: hand;
}
#base {
	width: 650px;
	overflow: auto;
	height: 530px;
	padding-right: 10px;
}
.func {
	font-family: Verdana;
	font-weight: bold;
	font-size: 12px;
	padding: 2px;
}
#tree #total {
	background-image: url(list.gif);
	background-repeat: no-repeat;
	background-position: left;
	padding-left: 25px;
}
#tree .complate {
	background-image: url(blog.gif);
	background-repeat: no-repeat;
	background-position: left;
	padding-left: 25px;
	margin-left: 20px;
}
#tree .loading{
	background-image: url(wait.gif);
	background-repeat: no-repeat;
	background-position: left;
	padding-left: 25px;
	margin-left: 20px;
}
.funcbar {
	background-color: #1393C0;
	font-family: Verdana;
	font-size: 12px;
	color: #ffffff;
	text-align: right;
	height: 18px;
	width: 100%;
	float: right;
}
.funcbar span{
	text-decoration: underline;
	padding-right: 2px;
	padding-left: 2px;
	margin-right: 2px;
	margin-left: 2px;
	cursor: crosshair;
	cursor: hand;
}
.bloglist {
	width: 97%;
}
.bloglist .bloginfo{
	background-color: #EBF5F8;
	width: 100%;
	float: right;
	clear: both;
}
.bloglist .bloginfo h1{
	float: left;
	clear: left;
	width: 70%;
	font-size: 24px;
	color: #1393C0;
}
.bloglist .bloginfo .blog_description{
	float: left;
	clear: left;
	width: 70%;
}
.bloglist .bloginfo .image{
	float: right;
	clear: right;
	width: 30%;
	vertical-align: top;
	text-align: right;
}
.bloglist .bloginfo .count_pub_date{
	clear: both;
	width: 100%;
	background-color: #EEEEEE;
	border-bottom: 2px solid #ccc;
	border-top: 1px dotted #ccc;
}
.bloglist .blogitem{
	background-color: #FFFFFF;
	width: 100%;
	clear: both;
	float: right;
}
.bloglist .blogitem h2{
	font-size: 18px;
	color: #1393c0;
}
.bloglist .blogitem h3{
	font-size: 12px;
}
.bloglist .blogitem .item_pub_date{
	border-bottom: 2px solid #ccc;
	border-top: 1px dotted #ccc;
}
-->
</style>
</head>
<body>
<div id="tree"> <span class="func" id="add">Add</span><span class="func" id="refresh">Refresh</span>
  <div id="total">Feeds Count...</div>
  <div class="complate" id="r1">Feeds item</div>
  <div class="loading" id="r1">Feeds item</div>
</div>
<div id="base">
  <div class="bloglist">
    <div class="funcbar">
	  <span id="del1">unsubscribe</span> <span id="edit1">edit subscription</span>
	</div>
	<div class="bloginfo">
	  <h1 id="bt1">blogtitle</h1>
	  <div class="image"><img id="image1" src="" alt="" /></div>
	  <div class="blog_description" id="bd1">BlogDescription</div>
	  <div class="count_pub_date" id="cp1">count n|Updated: last_pub_date</div>
	</div>
	<div class="blogitem">
	  <h2 id="it1">item_title</h2>
	  <h3 id="id1">author</h3>
	  <div class="item_description" id="id1">item_description</div>
	  <div class="item_pub_date" id="ipd1">Posted on: pub_date</div>
	</div>
  </div>
</div>
</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -