html5图片居中,html5图片居中标签

网页居中 html5

如果想沾满页面,宽度设置为 max-width:100%(意思是最大宽度为100%,就算图大于页面会自动缩小不会让页面有滚动条)

如果想居中,使用margin 0 auto;

但想沾满又居中的话,可以在外面再包裹有一个div即可,外面的div设置固定宽度或100%宽,里面的设置居中

相关问答

Q1: html5的问题

父级设置  position:relative;  

图片设置 position:absolute;margin:auto;top:0;bottom:0;left:0;right:0; //上下左右居中，如果只是上下居中则 top:0;bottom:0; 只是左右居中 left:0;right:0;

Q2: html中li显示的这样几张图片，怎么让他们适应不同分辨率的手机居中显示

直接float就可以了

ul, ul li{

box-sizing:border-box;

-moz-box-sizing:border-box;

-webkit-box-sizing:border-box;

}

ul li{display:inline;float:left;width:50%;height:100px;padding:0 10px;}

ul

li/li

li/li

li/li

li/li

li/li

/ul

可以这么写试试看，图片直接设置为display:block;如果宽度是根据窗口缩放的话，可以直接设置为100%；如果定宽就写margin:0 auto;图片就是居中的。

Q3: HTML5背景图片怎么居中？

首先 设置背景图片的大小

然后通过设置居中 margin：10% 10% 10% 10%；

margin:上右下左;即为到上右下左的距离。

无明确数值 可使用auto代替

Q4: HTML CSS中如何实现DIV中的图片水平垂直居中对齐

HTML CSS中实现DIV中的图片水平垂直居中对齐的方法：

所谓的图片水平垂直居中就是把图片放在一个容器元素中（容器大于图片尺寸或是指定了大小的容器），并且图片位居此容器正中间（中间是指元素容器的正中间），而图片不是以背景图片（background-image）形式展示，是以img元素形式展示的。如下图所示：

1、解决水平居中的办法：如果图片左浮动并且"display:inline"时，只要给图片设置一个"text-align:center"属性，就顺利解决了水平居中。

2、解决垂直居中的办法：使用display:table-cell和设置了display:inline-block的线合span。

完整例子：

html代码：

ul class="imgWrap clearfix"

lia href="#" class="imgBox"span/spanimg src="images/img1.jpg" alt="" //a/li

lia href="#" class="imgBox"span/spanimg src="images/img2.jpg" alt="" //a/li

lia href="#" class="imgBox"span/spanimg src="images/img3.jpg" alt="" //a/li

lia href="#" class="imgBox"span/spanimg src="images/img4.jpg" alt="" //a/li

/ul

css代码：

style type="text/css"

.imgWrap li {

float: left;

border: solid 1px #666;

margin: 10px 10px 0 0;

list-style: none;

border-collapse: collapse;

}

.imgWrap a {

background: #ffa url(images/gridBg.gif) repeat center;

width: 219px;

height: 219px;

display: table-cell;/*图片容器以表格的单元格形式显示*/

text-align: center; /* 实现水平居中 */

vertical-align: middle; /*实现垂直居中*/

}

.imgWrap a:hover {

background-color: #dfd;

}

.imgWrap img {

border: solid 1px #66f;

vertical-align: middle; /*图片垂直居中*/

}

/style

实现效果如下：

Q5: html中使图片居中的代码是什么？

html中使图片居中的代码是：img src="" alt="" align="center" /

怎样让html中的img标签居中显示？

1、首先我们需要打开电脑，找到DW软件的快捷键，双击打开之后，新建一个html页面。

2、然后我们会进入到DW的HTML页面的编辑页面，我们需要将新建的html页面进行一个保存。

3、将网页保存好之后，我们需要重新回到DW的编辑页面。

4、然后我们需要在body部分新建一个div标签，并在其中插入一张img图片。并给div添加简单的css样式。

5、然后我们在浏览器中查看效果，可以发现图片是默认左对齐的，并没有在div的正中央显示。

6、此时为图片添加居中属性也是没有用的，我们需要将图片套在一个p或者span标签中，给标签添加一个text-align:center属性。