每一个横向的div为hj-vertical-split-div并相对定位，里面有一个拖动改变左右的label为hj-vertical-split-label，不能占有位置，所以要绝对定位，并定位到最下边并宽为100%，最后一个竖向的div不用再放hj-vertical-split-label的label。
创新互联公司主要从事成都网站建设、成都网站设计、网页设计、企业做网站、公司建网站等业务。立足成都服务文安,十余年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:13518219792
拖动改变上下的label时，向上时，label的父div的高度变小。
label的父div相邻的下边的div高度变大。
其实就是你得写2套或更多样式(除了pc、手机还有平板)，相关知识自行百度，网上有很多现成教程和代码：
用js或服务器端语言判断UA、屏幕尺寸等，当为pc时，载入样式表A，当为手机时载入样式表B
用css媒体查询根据屏幕宽度调用不同样式
比如导航栏：
ul id="nav"
lia导航1/a/li
lia导航2/a/li
lia导航3/a/li
/ul
/*这是pc上的样式*/
#nav{
width:960px;
}
#nav li{
float: left;
_display: inline;
}
#nav li a{
display: block;
width: 90px;
line-height: 30px;
font-size: 12px;
}
/*这是手机上的样式*/
#nav{
width: 100%;
}
#nav li{
display: block;
width: 100%;
}
#nav li a{
display: block;
width: 100%;
line-height: 30px;
font-size: 12px;
}
这个用不到JavaScript的吧？
直接用锚就轻松搞定问题了呀：
链接页面：
!doctype html
html
head
meta charset="utf-8"
title链接页面/title
/head
body
a target="_blank" href="index.html#a"a/a
a target="_blank" href="index.html#b"b/a
a target="_blank" href="index.html#c"c/a
a target="_blank" href="index.html#d"d/a
a target="_blank" href="index.html#e"e/a
/body
/html
index页面（也就是那个内容比较多，想要直接定位的页面）：
!doctype html
html
head
meta charset="utf-8"
title分页面/title
/head
body
/body
div style="height:500px; background:#CCC;" id="a"aaa/div
div style="height:500px; background:#DDD;" id="b"bbb/div
div style="height:500px; background:#EEE;" id="c"ccc/div
div style="height:500px; background:#ccc;" id="d"ddd/div
div style="height:500px; background:#ddd;" id="e"eee/div
div style="height:500px; background:#eee;" id="f"fff/div
/html
html
body
script
/*
* 参数n为显示行数
*/
function showSjStar(n){
for(var i=0;in;i++){
for(var p=0;pn-i;p++){//输出空格，输出个数为总行数减去当前行数
document.write(" ");
}
for(var s=0;s2*i+1;s++){//输出*，每行输出的个数为 （2*行数+1）
document.write("*");
}
document.write("br");
}
}
showSjStar(5);//显示5行*的等腰三角形，可以自己改变数字看一下
/script
/body
/html
