CSSのアニメーションを使ってよく見るローディングアイコンを作れます！ローディングの形はボーダーで作ります。 html <div class="loadingicon"></div> css .loadingicon { width: 40px; height: 40px; /* まずボーダーをつけます */ border: 8px solid gray; /* 次にボーダーの右線を透明に */ border-right-color: transparent;
奇数行、偶数行だけスタイルを指定したい時は 奇数は:nth-child(odd)、偶数は:nth-child(even)を使います。 html <ul> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> <li>リスト4</li> <li>リスト5</li> </ul> css ul > li:nth-child(odd) { color: red;}ul > li:nth-child(even
日々のエラーやできなかった事、解決方法をシェアしていきます。 cssで文字をど真ん中にする方法。 html <div> <p>ど真ん中</p> </div> css div { width: 500px; height: 500px; background-color: pink; display: flex; justify-content: center; align-items: center;}p { font-size: 24px;} 要素を横並び
日々のエラーやできなかった事、解決方法をシェアしていきます。 今日はCSSでの点線の引き方です。 html <p>点線を引きたい</p> css p { border-bottom: 2px dotted pink;} これで2pxの太さのピンク色の点線が引きますが、ブロック要素の為、文字の下だけでなく、画面いっぱいに線が伸びてしまいます。私はここで目視で幅をwidth: 300px;と変えてなんとか文字の下にだけ線を引きました。 が、、、こんな幅を目分量で
