ボタンの周りに輪郭を作りたい。しかし、曲線の代わりにデフォルトとして、矩形の形になっています。私はCSSを使用して曲線の丸い輪郭を作るように案内してください。曲線のボタンの概要HTMLのCSS
おかげ
<!DOCTYPE html>
<html>
<head>
<style>
input {
border: 2px solid #a1a1a1;
padding: 10px 40px;
background: #dddddd;
width: 300px;
border-radius: 25px;
outline : 2px solid red;
}
</style>
</head>
<body>
<input type="button" value="Button" />
</body>
</html>
border-radiusは、トリックを行います。
RE：これはoutlineがその行を削除しようとしているためです。
OPはポストで 'border-radius'を使用しています！ –
まだ役に立ちません。 OPはスタイルをどのように 'outline'に要求し、あなたはそれを削除するように言いました。 –
の代わりにbox-shadowを入力してみてください。同様に：
input {
border: 2px solid #a1a1a1;
padding: 10px 40px;
background: #dddddd;
width: 300px;
border-radius: 25px;
box-shadow: 0 0 5px red;
}<html>
<body>
<input type="button" value="Button" />
</body>
</html>・ホープ、このことができます：
input {
border: 2px solid #a1a1a1;
padding: 10px 40px;
background: #dddddd;
width: 300px;
border-radius: 25px;
box-shadow: 0 0 3px red;
}
は、以下のスニペットを見てください！
私のガイドラインの指示に従って、私はボックスシャドウを使用すべきではありません。ボックスシャドーなしで私はアウトラインを行う必要があります。 – Velmurugan
これはネイティブには不可能です。 Firefoxのプロパティは-moz-outline-radiusですが、すべてのブラウザでサポートされているわけではありません。
複数の罫線のヘルプについては、さまざまなテクニックがあります。
ヘッダ部分に、ブートストラップのjsとcssファイルを追加してみてくださいそして、
<div class="container">
<img src="your_img.jpg" class="img-rounded" alt="img_name" >
</div>
ブートストラップファイルがanywhere.youからダウンロードすることができ曲線は次の3つのファイルが必要に作るために.imgの-丸みを帯びたクラスを使用しますHTMLのヘッド部に追加する
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
可能重複[概要半径？]（http://stackoverflow.com/questions/5394116/outline-radius） –