検索

ホームページ >ウェブフロントエンド >htmlチュートリアル >HTML と CSS を使用して円形および丸みを帯びた画像形式を実装する方法のサンプル コード

HTML と CSS を使用して円形および丸みを帯びた画像形式を実装する方法のサンプル コード

黄舟
黄舟オリジナル
2017-07-22 09:50:382733ブラウズ


エフェクト表示


HTML と CSS を使用して円形および丸みを帯びた画像形式を実装する方法のサンプル コード

実装コード

<<!DOCTYPE html><html><head>
    <title>JcMan</title>
    <style type="text/css">

    .image1{ 
        margin-top: 100px; 
        width:200px; 
        height:200px; 
        border-radius:200px; 
    }

    .image2{        margin-top: 100px; 
        width:200px; 
        height:200px; 
        border-radius:20px; 
    }
    </style>
    </head>
    <body>
    <center>
    <img class="image1" src="http://b.hiphotos.baidu.com/image/pic/item/b999a9014c086e069cd7964b00087bf40ad1cbb7.jpg"/>
    <img class="image2" src="http://b.hiphotos.baidu.com/image/pic/item/b999a9014c086e069cd7964b00087bf40ad1cbb7.jpg"/> 
    </center>
    </body>
    </html>

以上がHTML と CSS を使用して円形および丸みを帯びた画像形式を実装する方法のサンプル コードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：HTMLのスペースの問題を解決する次の記事：HTMLのスペースの問題を解決する

関連記事

続きを見る