【デイトラ17日目】
— オサナイユウタ🎸🍺🖥 (@osanaiyuta) February 21, 2020
これまでのhtml, css, bootstrap の復習。ここ何日かのインプット量に比べるとゆったり。
プログラミング関係ないけど、PCでYouTube見る時は、スペースキーで一時停止/再生すると楽ですよ。#デイトラ #30DAYSトライアル
色々今までのことをまとめていきます。
初期コードメモまとめ
html5ではこっちが一般的
<header>と<footer>
透明度
opacity
ボタンの設置html
<a href="#" class="btn twitter">Twitter</a>
アニメーションをつける
transition:all 1s;
imgにhtmlを重ねる
親要素にposition: relative;を指定。その子要素にabsoluteを指定。
カーソルを乗せる前と乗せる前に変化をつける
cursor:pointer; cursor:deault;
boxに影をつける
box-shadow:水平 垂直 色;
hederをtopに固定
header { position:fixed; top:0;}
メディアクエリ(PC・タブレット・スマホ)ごとにブレイクポイントを指定する
@media (max-width: 1000px)
box-sizingをborder-boxに指定すると、要素の幅(width)の合計にpaddingとborderが含まれる。*{ }で全てに適応
*{ box-sizing: border-box; }
画面幅によって全体のwidthが変わるように、width: 100%に変更
width: 100%;
floatを解除
clear:left;
中央寄せ
text-align:center
参考サイトまとめ
実際の体験記。マジで参考になります。
タキのデイトラ解説 | アルパカの30DAYSトライアル1st,2ndまとめブログ
プログラミングに関する知識を記録・共有するためのサービス。わからないところがあって検索すると大体このサイトに行き着きました。
デイトラやって速攻正社員になっただりあさんのブログ
naolife.online|未経験から正社員コーダーになったアラサー女子が日々の勉強をメモするブログ
デイトラ発起人ショーヘーさんTwitter
ショーヘー@Webエンジニア (@showheyohtaki) | Twitter