登録済みリスト

登録済みリスト

おしゃれな見出し

cssコード

.sample_h_1{
font-size: 1.5em;/* フォントサイズ /
font-weight: bold;/
フォント太さ /
padding-top: .5em;
padding-bottom: .5em;
margin-bottom: 2em;
border-bottom: solid 3px #111111;/
線 */
}

おしゃれな見出し

cssコード

.sample_h_18{
font-size: 1.5em;/* フォントサイズ /
font-weight: bold;/
フォント太さ /
padding-top: .5em;
padding-bottom: .5em;
margin-bottom: 2em;
position: relative;
margin: 3em 0 2em;
color:#1e7aca;/
フォント色 */
}

.sample_h_18:before {
position: absolute;
content: “”;
display: block;
width: 100%;
height: 4px;
background: repeating-linear-gradient(90deg, #1e7aca 0%,rgba(255, 255, 255, 0) 100%);
bottom: 0;
left: 0;
z-index: 0;
}

HTM(cssコードなし)

★ここに文字を入力してください。

チェック!ここに文字を入力

CSSコード

.sample_box3_1 {
position: relative;
padding: 1em 1.5em;
margin: 2em 0;
border: solid 3px #c71585;//
border-radius: 8px;/角の丸み/
color: #000000;/文字色/
}
.sample_box3_1 .sample_box_title{
position: absolute;
display: inline-block;
top: -13px;
left: 10px;
padding: 0 10px;
line-height: 1;
font-size: 1.3em;/タイトル文字サイズ/
background: #ffffff;/タイトル文字背景色/
color: #c71585;/タイトル文字色/
font-weight: bold;
}
.sample_box3_1 p {
margin: 0;
padding: 0;
}

ここに文章

cssコード
.box1 {
padding: 0.5em 1em;
margin: 2em 0;
font-weight: bold;
border: solid 3px #000000;
}
.box1 p {
margin: 0;
padding: 0;
}

HTM(cssコードなし)

★ここに文字を入力してください。

ここに文章

h1 {
position: relative;
padding: 0.25em 0;
}
h1:after {
content: “”;
display: block;
height: 4px;
background: -webkit-linear-gradient(to right, rgb(255, 186, 115), #ffb2b2);
background: linear-gradient(to right, rgb(255, 186, 115), #ffb2b2);
}