导航:首页 > 万维百科 > 网页设计的框架边框怎么居中

网页设计的框架边框怎么居中

 发布时间：2020-09-15 10:06:36

1、html中css+div！一个网页的整体框架居中

如：首先对body{margin:0;padding:0;}//主要是控制上边距
然后：.css{width:960px;height:200px;margin:0 auto;} 以上是样式
下面在HTML中：
<body>
<div class="css"></div>
</body>
就可以居中了！

2、网页设计 框架页居中的问题

用相对 长度 30% 为宽度
如你要左右1:3 ，可把左设25% 右 75%

内嵌框架
<iframe src=目标></iframe>

<frameset cols=25%,*>
<frame src="Bcol.html"> <frame src="Ccol.html">
</frameset>

3、网页设计边框做的不能居中

先把body设置成<body style="text-align:center;">
再把要居中的框设置成< style="margin:0px auto;">

4、怎样使框架网页在浏览器中居中？

网页框架居中方法如下：

在<body text-align="center">
2.#box{margin-left:auto;margin-right:auto;}

3.把所有框架嵌套到一个DIV标签里面，然后设置这个DIV标签的style属性为"margin:0 auto; width:网页的宽度"


5、怎么着让html的框架居中？

你这个事html中的表格代码，要居中的话可以这样
<table cellspacing="0" align="center">
水平居中

6、制作网页中如何将框架集居中?

新建一个网页，增加一个iframe，然后将框架集放在一个iframe里边 将iframe的源文件设置为框架，然后各iframe设置宽高到你希望的样子。将iframe剧中就行了

7、css怎样将边框里的东西居中

对LS各种回答表示……
不懂就别装~
第一个错，跟着就照抄……
水平居中是
text-align:center;
垂直居中是
vertical-align
不过只能用在表格里，以上……

8、网页制作图片怎么居中

图片的宽度和高度是未知的，没有一个固定的尺寸，在这个前提下要使图片在一个固定了宽度和高度的容器中垂直居中，想想感觉还是挺麻烦的，由于最近的项目可能会用到这个方案，所以把一些常用的方法都收集整理了一下。

下图是理想中的效果图，外部容器的宽度和高度是固定的，中间的图片宽度和高度未知，但是图片要始终要相对于外部的容器垂直居中。

但是实际中实现的效果并不是很完美，由于各浏览器的解析都各不相同，所以各浏览器都会有1px-3px的偏差。

方法一 (XHTML 1.0 transitional)：

该方法是将外部容器的显示模式设置成display:table，img标签外部再嵌套一个span标签，并设置span的显示模式为display:table-cell，这样就可以很方便的使用vertical-align象表格元素那样对齐了，当然这只是在标准浏览器下，IE6/IE7还得使用定位。

HTML结构部分：

<div id="box">
  <span><img src="images/demo.jpg" alt=""></span>
</div>

CSS样式部分：

<style type="text/css">
#box{
width:500px;height:400px;
display:table;
text-align:center;
border:1px solid #d3d3d3;background:#fff;
}
#box span{
display:table-cell;
vertical-align:middle;
}
#box img{
border:1px solid #ccc;
}
</style>
<!--[if lte IE 7]>
<style type="text/css">
#box{
position:relative;
overflow:hidden;
}
#box span{
position:absolute;
left:50%;top:50%;
}
#box img{
position:relative;
left:-50%;top:-50%;
}
</style>
<![endif]-->

方法二 (XHTML 1.0 transitional)：

方法二和方法一的实现的原理大同小异，结构也是相同的，方法一用的是条件注释，方法二就用的CSS Hack。

CSS样式部分：

<style type="text/css">
#box{
width:500px;height:400px;
overflow:hidden;
position:relative;
display:table-cell;
text-align:center;
vertical-align:middle;
border:1px solid #d3d3d3;background:#fff;
}
#box span{
position:static;
*position:absolute; /*针对IE6/7的Hack*/
top:50%; /*针对IE6/7的Hack*/
}
#box img {
position:static;
*position:relative; /*针对IE6/7的Hack*/
top:-50%;left:-50%; /*针对IE6/7的Hack*/
border:1px solid #ccc;
}
</style>

该方法有个弊端，在标准浏览器下由于外部容器#box的显示模式为display:table-cell，所以导致#box无法使用margin属性，并且在IE8下设置边框也无效。

方法三 (XHTML 1.0 strict)：

标准浏览器还是将外部容器#box的显示模式设置为display:table-cell，IE6/IE7是利用在img标签的前面插入一对空标签的办法。

HTML结构部分：

<div id="box"><i></i><img src="images/demo.jpg" alt=""></div>

CSS样式部分：

<style type="text/css">
#box{
width:500px;height:400px;
display:table-cell;
text-align:center;
vertical-align:middle;
border:1px solid #d3d3d3;background:#fff;
}
#box img{
border:1px solid #ccc;
}
</style>
<!--[if IE]>
<style type="text/css">
#box i {
  display:inline-block;
  height:100%;
  vertical-align:middle
  }
#box img {
  vertical-align:middle
  }
</style>
<![endif]-->

方法三也同样适用XHTML 1.0 transitional。以上方法都是收集于网页教学网，暂时只对这3个方法比较满意，兼容性方面不错，使用起来的限制也比较小，还有些方法我也都一一测试过，效果都不理想，在各浏览器中的差异比较大。另外司徒正美这里也收集了一些方法。

9、让框架里的网页在框架里居中显示。怎么做？

最简单的就是<center></center>，但是这样的话只要是在这个标签里的内容全部都会居中，不管你是否设置了左对齐还是右对齐，全部居中显示。

或者用margin：0px auto也可以实现居中。

与网页设计的框架边框怎么居中相关的知识