Category: CSS

よく使うCSSアニメーションのショートハンド

よく使うCSSアニメーションのショートハンド。いつも忘れるのでメモしときます。 See the Pen Untitle...

HTML

<div class="yt_cont">
  <iframe src="https://www.youtube.com/xxxx/xxxxxxxxxxxxx" frameborder="0" allowfullscreen></iframe>
</div>

</div>

CSS(SCSS) [crayon-628d...

01. _setting.scssなどに下記を記述する $viewportに基準となる画面幅をセット [crayon-6...

iOSのSafari初回読み込み時にCSSアニメーションの動きが変な時があります。時には動かいないときもあります。一...

下記記述でCSSでaタグのリンクを無効化することができます。 [crayon-628d4fe853b7270593226...

overflow:autoやscrollなどで邪魔なスクロールバーを消したいときはこれを記述するべし。 [crayon-...

「inview.js」を使用して、スクロールした時画面上に要素が表示した際、タイプライラーのように一文字ずつ表示するやつ...

主要デバイス（スマホ、タブレット）のブラウザ画面サイズ表です。デバイス名画面サイズ（ピクセル） iPhone SE ...

CSSで縦書きセンタリングする時の最低限のスタイル。 IE11はh2、p要素に対して下に謎の余白が発生します。「max-...

iPhoneを横向きにしたとき文字サイズが拡大しないようにする方法は下記スタイルを記述すると拡大されません。 iOSの親...

// 横向き
@media screen and (orientation: landscape) {
}

// 縦向き
@media screen and (orientation: portrait) {
}

// 横向き

@media screen and (orientation: landscape) {

}

// 縦向き

@media screen and (orientation: portrait) {

}

html

<div class="center">
 <p>天地左右<br>中央です</p>
</div>

</div>

css [crayon-628d4fe853...