Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

border-bottomを使わず文字の下にマーカーを引いた様に見せる

■ はじめに

タイトルについて記事にしました。
この記事で得る内容は以下の通りです。

・ cssの基礎知識が増える
background,linear-gradientプロパティについて

■ メモ

isara

isara先輩.png

border-bottomでは文字と離れすぎてしまったり、positionを使いたくない時に使えます
20/11/21(土)追記:普通に線引くならtext-decoration: underline;

index.scss
span {
  font-weight: bold;
  background: linear-gradient(transparent 70%, #ebb94d 70%);
}

・ お役立ちリンク
CSSのグラデーション(linear-gradient)の使い方を総まとめ!

s79ns
100記事投稿を目標に、質にも拘った良記事を書き続けます🔥
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away