テキストのフォーム(基本)
シンプルなテキストのフォームです。
Source Code
右上の「コピー」からご利用ください。
コピー
<form class="my-parts">
<p><label for="text">テキスト</label><input id="text" type="text" value="" name=""></p>
</form>
コピー
.my-parts {
text-align: left;
}
.my-parts label {
display: block;
font-size: .95em;
margin: 0 0 .2em;
}
.my-parts p {
margin: 0 0 1em;
}
.my-parts input {
width: 100%;
padding: .4em .8em;
border-radius: 0;
background-image: none;
background-color: transparent;
border: 1px solid rgba(0,0,0,.1);
font-family: inherit;
font-size: .95em;
color: inherit;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
}
.my-parts input:focus {
outline: none;
box-shadow: none;
border: 1px solid rgba(0,0,0,.3);
}