見出し画像

見出しデザイン_07【動画解説+サンプルコード公開中】

ホームページ制作初心者のために『HTML,CSSのみ』で作れる下記の画像のような見出しのデザインの作り方を動画でレクチャーさせていただきます。

スクリーンショット 2020-03-28 22.22.40

動画解説

サンプルデータダウンロードはこちら↓

HTML,CSS初期設定の方法

HTML,CSS初期設定の方法はこちら

サンプルコード

HTML

<body>

   <h1>見出し</h1>
   
</body>

CSS

h1{
   margin: 1em;
   padding: .2em .3em;
   border:2px solid rgb(27, 167, 214);
   border-top-left-radius: .5em;
   border-bottom-right-radius: .5em;
   color: rgb(27, 167, 214);
   font-size: 2em;
}

この記事が参加している募集

はじめてのインターネット

この記事が気に入ったらサポートをしてみませんか?