2021-04-18から1日間の記事一覧

WebDesign 背景画像 parallax

ポイントは、 position: relative; background-attachment: fixed を同じクラスにつけること画像を配置しているクラスにCSSを当てる <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Parallax Website…</meta></meta></meta></head></html>

HTML アニメーション小技まとめ

CSSアニメーション animate.style javascript animate.js animejs.com jQuery UI 未だに結構つかう jqueryui.com 文字を動かす tobiasahlin.com

nav バー 左右分割

目的:左右に分割したnavバーをつくる 真ん中はアイコンが配置されている <style> .navbar_test { display: flexbox; position: relative; } .icon_image img { width: 100px; height: 100px; z-index: 200; } .icon_image { position: absolute; left: 50%; top: 5…