Rumah > Artikel > hujung hadapan web > css中怎么把图片设置居右
css中怎么把图片设置居右
- 醉折花枝作酒筹asal
- 2021-04-23 14:43:5418171semak imbas
在css中，可以使用text-align属性把图片设置居右，只需要给图片元素设置“text-align:right;”即可。text-align属性指定元素文本的水平对齐方式，当值为right时，表示该元素排列到右边。
本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。
新建一个html文件，命名为test.html，用于讲解css如何让div中的图片居右对齐。在test.html文件内，使用div标签创建一个模块，设置div标签的class属性为mycss。在div内，使用img标签创建一张图片。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
</style>
</head>
<body>
<div class="mycss">
<img src="images/2.jpg" alt="">
</div>
</body>
</html>在css标签内，通过class设置div的样式，定义它的宽度为400px,高度为300px，边框为1px。再将text-align属性设置为right,用于让div内的内容居右对齐，从而实现图片居右对齐。
<style type="text/css">
.mycss{
width:400px;
height: 300px;
border: 1px solid #ccc;
text-align: right;
}
</style>在浏览器打开test.html文件，查看实现的效果。
![YWRNC$]$}_SNK)(ETB7743A.png](https://img.php.cn/upload/image/290/425/595/1619150348389589.png "1619150348389589.png")
推荐学习：css视频教程
Atas ialah kandungan terperinci css中怎么把图片设置居右. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：css怎么设置图片拉伸Artikel seterusnya：css如何去掉图片边框