PHP แสดงรูปโปรไฟล์ แบบวงกลม ด้วยภาษา CSS

สอนเขียน PHP แสดงรูปโปรไฟล์ แบบวงกลม ด้วยภาษา CSS บทความนี้แนะนำการแสดงรูปภาพแบบวงกลมด้วย CSS ตัวอย่างจะแสดงรูปภาพผ่าน div และใช้คำสั่ง border-radius เพื่อแสดงรูปโปรไฟล์ แบบวงกลม สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง PHP แสดงรูปโปรไฟล์ แบบวงกลม ด้วยภาษา CSS

<style>
    .avatar {
        background-position: center;
        background-size: cover;  
        border-radius: 50%;
        width: 120px;
        height: 120px;    
    }
</style>

<?php
    echo "<div class='avatar' style='background-image:url(https://www.devdit.com/chmod/user_avatar/3default.jpg);'></div>";
?>

PHP แสดงรูปโปรไฟล์ แบบวงกลม ตัวอย่างแสดงรูปภาพผ่าน div ด้วยคำสั่ง background-image จากนั้นกำหนดรูปภาพให้โค้งแบบวงกลมด้วยคำสั่ง border-radius: 50% และกำหนดขนาดการแสดงผลของรูปภาพเป็น 120x120px พร้อมกับให้รูปภาพแสดงแบบตรงกลางด้วย background-position และ background-size ด้วย class ชื่อ avatar