没事写写css
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="Scripts/jquery-1.10.2.min.js"></script>
<style type="text/css">
ul, li {
margin: 0;
padding: 0;
}
.biaoti {
border: 1px solid red;
color: red;
margin-top: 10px;
height: 40px;
}
ul {
margin-top: 0.1px;
list-style: none;
height: 100%;
}
ul li {
text-align: center;
list-style-type: none;
margin-left: -1px;
float: left;
padding-left: 0px;
border: 1px solid #0094ff;
height: 100%;
width: 16.5%;
}
#left {
border: 1px solid #0094ff;
width: 80%;
float: left;
height: 40px;
}
#right {
margin-left: 80%;
border: 1px solid #000000;
width: 20%;
height: 40px;
}
.direction {
height:50%;
border-bottom: 1px solid #ff00dc;
}
</style>
<script type="text/javascript">
$(function () {
alert(1);
$("#right .direction").eq(0).on("click", function () {
// alert("up");
if (pageIndex < pages) {
pageIndex++;
changeNum();
}
})
$("#right .direction").eq(1).on("click", function () {
//alert("down");
if (pageIndex > 1) {
pageIndex--;
changeNum();
}
})
});
function changeNum() {
var startRecord = (pageIndex - 1) * pageSize + 1;
var endRecord = pageIndex * pageSize;
var newHtml = "";
newHtml+="<ul>"
for (var i = startRecord; i <= endRecord; i++) {
if (i > rows) { break;}
newHtml+="<li ><div style=\"margin-top:5%\">"+i+"</li>"
}
newHtml+="</ul>"
$("#left").html(newHtml);
}
var pageIndex = 1;
var pageSize = 6;
var rows = 31;
var pages = Math.floor((rows - 1) / pageSize) + 1;
</script>
</head>
<body>
<form id="form1" runat="server">
<div style="height: 100%;">
<div class="biaoti">
<div id="left">
<ul>
<li ><div style="margin-top:5%">01</div></li>
<li><div style="margin-top:5%">02</div></li>
<li><div style="margin-top:5%">03</div></li>
<li><div style="margin-top:5%">04</div></li>
<li><div style="margin-top:5%">05</div></li>
<li><div style="margin-top:5%">06</div></li>
</ul>
</div>
<div id="right">
<div class="direction" style="background:#0094ff">
<div style="text-align: center;">+</div>
</div>
<div class="direction" style="background:#808080">
<div style="text-align: center;">-</div>
</div>
<%-- <div class="direction">
<div style="text-align: center;">down1</div>
</div>--%>
</div>
</div>
<div class="biaoti">
<ul>
<li>11</li>
<li>12</li>
<li>13</li>
<li>14</li>
<li>15</li>
<li>16</li>
</ul>
</div>
</div>
</form>
</body>
</html>
没事写写css的更多相关文章
- LOJ 10155 - 「一本通 5.2 例 3」数字转换
前言 从现在开始,这个博客要写一些题解了.起初,开这个博客只是好玩一样,没事就写写CSS.JS,然后把博客前端搞成了现在这个样子.以前博客只是偶尔记录一些东西,刷题也从来不记录,最近受一些学长的影响, ...
- 一个五年 Android 开发者百度、阿里、聚美、映客的面试心经
花絮 也许会有人感叹某些人的运气比较好,但是他们不曾知道对方吃过多少苦,受过多少委屈.某些时候就是需要我们用心去发现突破点,然后顺势而上,抓住机遇,那么你将会走向另外一条大道,成就另外一个全新的自我. ...
- 《IT蓝豹》挑战独立开发项目能力
做了5年的android开发,今天没事写写刚入行不久的时候第一次独立开发项目的心得体会, 当时我刚工作8个月,由于公司运营不善倒闭了,在2011年3月份我开始准备跳槽, 看了一周andro ...
- oracle、mysql、sql server等;流行数据库的链接驱动配置
系统的写博客的时间不多,但是还想一直写来坚持,就没事写写积累下来的知识点吧 #ORACLE #jdbc.driver=oracle.jdbc.driver.OracleDriver#jdbc.url= ...
- 二分查找法 java
前几天去面试,让我写二分查找法,真是哔了狗! 提了离职申请,没事写写吧! 首先二分查找是在一堆有序的序列中找到指定的结果. public class Erfen { public static int ...
- 工作的准备:atoi,itoa,strcpy,memcpy,strcmp,二分查找,strcat
对常见的几个函数,周末没事写写,绝对是笔试面试中非频繁,前面n届学长无数次强调了,大家就别怀疑了.从今天开始,每天10道题. int atoi(const char* str) { if(str==N ...
- xcode 执行时模拟器不可选的问题
好久没写博客了,上一次是什么时候都想不起来了. 之前总认为脑袋记住了,用过了就能够了,干嘛要写博客,简直浪费时间.事实上没事写写博客优点还是挺多的.这样既能够对自己用过的和学到的东西做一个总结,也能提 ...
- Python集成开发环境(Eclipse+Pydev)
刚開始学习python,就用Editplus, Notepad++来写小程序, 后来接触了Sublime Text2.认为很不错,没事写写代码.就用编辑器Sublime Text2,最好再配搭一个ap ...
- 屌丝程序猿赚钱之道之taobao 2
续上篇,之前写的案例,都是比較0基础的. 案例4: 代写情书.软文.论文等等. 这是我一个同学的真实故事. 我隔壁寝室的小王平时没事就爱谢谢博客.逛逛论坛.大二的时候接触了威客网,開始在网上 ...
随机推荐
- 让camera实现类似cs第一人称视角旋转和位移
直接把这个脚本挂在摄像机上就可: using System.Collections; using System.Collections.Generic; using UnityEngine; /* * ...
- vue项目错误集
1.报错:vue.esm.js?efeb:591 [Vue warn]: Avoid using non-primitive value as key, use string/number value ...
- 12.Selenium+Python案例 -- 今日头条(获取科技栏目的所有新闻标题)
一:具体代码实现 # -*- coding: utf-8 -*-# @Time : 2018/7/26 16:33# @Author : Nancy# @Email : NancyWangDL@163 ...
- JSF中使用f:ajax标签无刷新页面改变数据
ajax本是用在前端的一种异步请求数据的操作,广泛用于js中,一般的js框架如jq都有被封装好的方法,用于发起异步请求操作.异步操作可以增强用户体验和操作,越来越多的程序都在使用ajax.JSF的fa ...
- 专题练习HDU题集 图论
[图论01]最短路 Start Time : 2018-01-02 12:45:00 End Time : 2018-01-23 12:45:00 Contest Status : Runnin ...
- c# linq查询语句详细使用介绍
本文介绍Linq的使用方法 linq介绍 LINQ只不过是实现IEnumerable和IQueryable接口的类的扩展方法的集合. LINQ可以查询IEnumerable集合或者IQueryable ...
- 10-10C#基础---数据类型之间的转换
10-10 C#基础数据类型转换(熟练掌握) 第一课 数据类型之间的转换 基本类型的转换:自动转换(隐式转换)和强制转换(显示转换) 装箱转换:允许值类型隐式转换成引用类型. 拆箱转换:允许将引用类 ...
- JMS编程模型
(1) ConnectionFactory创建Connection对象的工厂,针对两种不同的jms消息模型,分别有QueueConnectionFactory和TopicConnectionFacto ...
- AudioManager 音量『转』
获取系统音量 通过程序获取android系统手机的铃声和音量.同样,设置铃声和音量的方法也很简单! 设置音量的方法也很简单,AudioManager提供了方法: publicvoidsetStream ...
- IE双边距bug
标准参考 根据 W3C CSS2.1 规范中的描述,对于非替换的浮动元素,若 'margin-left' 或 'margin-right' 特性的计算值为 'auto',则它们的实际使用值为 '0'. ...