Introduction à la méthode de création d'images arrondies et d'images ovales avec CSS3-tutoriel CSS-php.cn

Introduction à la méthode de création d'images arrondies et d'images ovales avec CSS3

高洛峰

Libérer： 2017-03-07 15:23:07

original

2561 Les gens l'ont consulté

Cet article vous apprend principalement le code d'implémentation spécifique pour créer des images arrondies et des images elliptiques avec CSS3. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer

Les exemples de cet article sont partagés avec vous. La méthode de création d'images arrondies et ovales avec CSS3 est pour votre référence. Le contenu spécifique est le suivant

1 Images arrondies

<!DOCTYPE html>
<html>
<head>
<style>
img {   
    border-radius: 8px;   
}   
</style>
</head>
<body>
<h2>圆角图片</h2>
<p>使用 border-radius 属性来创建圆角图片:</p>
<img src="paris.jpg" alt="Paris" width="400"    style="max-width:90%">
</body>
</html>

Copier après la connexion

<. 🎜>

Introduction à la méthode de création dimages arrondies et dimages ovales avec CSS3

2. Image ovale

<!DOCTYPE html>
<html>
<head>
<style>
img {   
    border-radius: 50%;   
}   
</style>
</head>
<body>
<h2>椭圆形图片</h2>
<p>使用 border-radius 属性来创建椭圆形图片：</p>
<img src="paris.jpg" alt="Paris" width="400"    style="max-width:90%">
</body>
</html>

Copier après la connexion

Introduction à la méthode de création dimages arrondies et dimages ovales avec CSS3

Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'étude de chacun. J'espère également que tout le monde soutiendra le site Web PHP chinois.

Pour plus d'informations sur la façon de créer des images arrondies et des images ovales à l'aide de CSS3, veuillez faire attention au site Web PHP chinois !