+ 3
How can I align an image in html5?
I'm working on a project on my pc using html5, and I wanna align an image to the center but html5 doesn't support the <img> tag, so how can I align the image to the center by using css perhaps or something in html5 maybe.
9 odpowiedzi
+ 8
Here is w3schools example
<!DOCTYPE html>
<html>
<body>
<h1>The img align attribute</h1>
<p><strong>Note:</strong> The align attribute is not supported in HTML5. Use CSS instead!</p>
<h2>align="bottom" (default):</h2>
<p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42"> This is some text.</p>
<h2>align="middle":</h2>
<p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="middle"> This is some text.</p>
<h2>align="top":</h2>
<p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="top"> This is some text.</p>
<h2>align="right":</h2>
<p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="right"> This is some text.</p>
<h2>align="left":</h2>
<p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="left"> This is some text.</p>
</body>
</html>
this uses CSS to align
+ 12
<p><img src="cat.jpg" alt="cat"></p>
p{
text-align: center;
}
(text-align: left; or right)
+ 7
Hope this helps:
https://youtu.be/7BAG-h2f9kA
+ 3
valid HTML5 code:
<style>
.center { text-align: center; }
</style>
<div class="center">
<img src="/path/to/image.ext" alt="alt_text">
</div>
+ 3
<!DOCTYPE html>
<html>
<body>
<h1>The img align attribute</h1>
<p><strong>Note:</strong> The align attribute is not supported in HTML5. Use CSS instead!</p>
<h2>align="bottom" (default):</h2>
<p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42"> This is some text.</p>
<h2>align="middle":</h2>
<p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="middle"> This is some text.</p>
<h2>align="top":</h2>
<p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="top"> This is some text.</p>
+ 2
Use it inside the p tag
+ 1
Yes thanks I played around and I remembered the <div> tag and that you can give it properties in html itself
<div align="center">
<img src="blah" />
</div>
0
And thanks for answering
0
Yes I discovered that yesterday just before doing the <div> thing. I just haven't gotten that far in CSS yet but once my exams are over, which is today, I'll try completing the CSS course.