CSSだけで東京ブランド推進キャンペーンのようなロゴを作成サンプル
&TOKYO
<span class="logo"><span class="mark"><i>&</i></span><b>TOKYO</b></span>
.logo {
font-size: 2.6rem;
}
.logo .mark {
display: inline-block;
position: relative;
bottom: 0.3rem;
width: 3rem;
height: 3rem;
margin-right: 0.3rem;
line-height: 3rem;
border-radius: 50%;
background: #D2432C;
color: #FFF;
font-family: 'Amaranth';
font-style: normal;
text-align: center;
vertical-align: middle;
}
.logo .mark i {
position: relative;
bottom: 0.3rem;
font-style: normal;
font-weight: normal;
}
.logo b {
font-family: Arial;
font-weight: bold;
}