このフォームで私に連絡してくださいの下のテキストを彼らがどのように行うかをチェックしてください。かなり清潔でシンプル。http://www.onextrapixel.com/examples/html5-css3-contact-form/
これを行う実際のCSSは次のとおりです。
h1 {
font-family: 'Questrial', Verdana, sans-serif;
text-align:center;
font-size:40px;
padding:0;
margin:0 0 20px 0;
position:relative;
color:#8C8C8C;
}
/** have a nice ampersand **/
h1:after {
font-size:25px;
color:#D6CFCB;
content: '&';
text-align:center;
display:block;
width:100%;
font-family: 'Alice', Verdana, serif;
text-shadow: 0px 1px 0px #fff;
}
/** create the gradient bottom **/
h1:before {
position:absolute;
bottom:15px;
content: ' ';
text-align:center;
display:block;
height:2px;
width:100%;
background: linear-gradient(left, rgba(255,255,255,0) 0%,rgba(182,180,180,0.7) 42%,rgba(180,178,178,0) 43%,rgba(168,166,166,0) 50%,rgba(180,178,178,0) 57%,rgba(182,180,180,0.7) 58%,rgba(238,237,237,0.3) 90%,rgba(255,255,255,0) 100%); /* W3C */
}
さらに編集して申し訳ありませんが、ここに説明があります。h1 {...}は実際のテキストのスタイルを設定するため、「イベントスケジュール」が表示され、h1:before{...}はクールな線の効果を発揮します。h1:after {...}はアンパサンドを実行するので、これは実際にテキストを配置する場所です。