I put the text information html img tag in the
tag. Now I want the image to be horizontally centered, and the css style in pre cannot write text-align:center; <br> <br> in the pre tag. css style plus text-align:center; is very good to center the image, but the text is also centered <br> <br> My requirement is that as long as the image is centered, the text is not centered. Please give me some advice from css experts </p> <p> </p> <br> <h2>Reply to discussion (solution) </h2> <p class="sougouAnswer"> Then set the margin of the image! </p> <p class="sougouAnswer"> Why is there still text in pre? ? ? ? </p> <p class="sougouAnswer"> The size of the image is not fixed. It is not possible to set the margin. What I want is that the image with a non-fixed width can be displayed in the center. <br> <br> There is no text in the pre tag. I laughed </p> <p class="sougouAnswer"> Otherwise, you can use the picture as the background. If there are more, follow the method above. </p> <p class="sougouAnswer"> Adding an attribute margin:0 auto </p> <p class="sougouAnswer"> Background is a good idea. Otherwise, you can use the picture as the background. If there are more, follow the method above. </p> <p class="sougouAnswer"> Then you can only adjust img. Add a style to img {margin:0 auto;} but you have to set the width of pre to fixed. </p> <p class="sougouAnswer"> The correct answer above </p> <p class="sougouAnswer"> None of them are correct. I figured it out myself. <br> margin:0 auto; I have tried it a long time ago. <br> I also need to add display:block; if I don’t add it, it can’t be centered. </p> <p class="sougouAnswer"> Release css code and the same goes for div <br> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="sycode" name="code">pre{ position:relative; word-wrap:break-word; width:800px; margin:0 auto; }pre img{ display:block; margin:0 auto; max-width:760px;}