用css 如何设置页面居左

html-css013

用css 如何设置页面居左,第1张

用css 设置页面居左,首先我们需要写好一个div然后设置好它的宽高,然后在使用margin来操作,使它距离浏览器的左边为0就行了,marign的用法如图:

添加一个border方便观察,具体看代码:

<html>

<head>

<style>

.div1{                    

width:600px

height:200px

font-size:13px

border:1px solid #f00

margin:0px

}

</head>

<body>

<div class='div1'>

<p>我是测试文字</p>

</div>

</body>

</html>

可以通过JQ来获取右边高度再付值给左边。这样,右边内容再多,JQ也能把它的高度付值给左边,这样就会两边一样。

<script type="text/javascript" src="jquery-1.8.2.min.js"></script>

<script type="text/javascript">

//判断控制页面初始时左右的高度一致

   var hl = $(".left").outerHeight() //获取左侧left层的高度 

   var hr = $(".right").outerHeight() //获取右侧right层的高度  

   var mh = Math.max(hl,hr) //比较hl与hr的高度,并将最大值赋给变量mh

   $(".left").height(mh) //将left层高度设为最大高度mh  

   $(".right").height(mh) //将right层高度设为最大高度

   </script>

还可以通过一些滚动插件:比如jQuery Scrollbars等,,,两边设置一致高度,然后右边多出来的内容就会出现一个滚动条,下拉来显示。

还可以设置左右两边高度一致,右边加上禁止溢出。。这样做,如果右边内容多出来了就不会显示出来,,

看你需要哪种,,