Home >Web Front-end >HTML Tutorial >How to center a 1900px image on a web page_html/css_WEB-ITnose

How to center a 1900px image on a web page_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:03:151378browse

Let me ask you a question. I want to widen the image to 1900px at the top of the web page. How can I center it? Does anyone have any js code or widget that can close the top image like JD.com? If you have any, you can send me an email at 923530881@qq.com. Thank you everyone


Reply to the discussion (solution)

The img attribute margin:0 auto in the div; the image is centered, JS does not require a plug-in, just a few words That’s it. If you don’t know how to write, you can search on Baidu

If it is a background image, you can do it like this

.box{
background:url(image address) center top no-repeat;
}

If you place img directly, you can use text-align:center



.box{
height:600px; //Set the height of the picture yourself
text-align:center;
}

The width of the picture is too large Right, margin-left: auto, margin-right: auto

The picture can be centered

The width of the picture is too large, margin-left: auto, margin-right: auto

The picture can be centered

I want to make a full-screen picture to adapt to the basic resolution, so it is relatively large. Thank you for your answer

The img attribute margin: 0 auto in the div; the image is centered, and JS does not require a plug-in, just a few sentences is enough. If you don’t know how to write, you can search it on Baidu


That picture is to be placed in the editable area I wrote, instead of adding directly into the div, so writing margin:0 auto; is useless. Thank you for your answer

If it is a background image, it can be like this

.box{
background:url(image address) center top no-repeat;
}

If you place img directly, you can use text-align:center



.box{
height:600px; //Set the height of the picture yourself
text-align:center;
}


That picture is to be placed where I write In the editable area, it is not necessary to add directly inside the div, so writing text-align:center; is useless. Thank you for your answer
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn