https://kimizuka.hatenablog.com/entry/2015/07/27/000000
に記載がある

var elm = doc.querySelectorAll("[id^='a']");

で、idにaが指定されているものを指定可能。

あとは、

for(var i = 0; i < elm.length; ++i)
{
	elements_acn_it[i].innerHTML = "メンテナンス中";
}

みたいにすれば、div要素のテキストを一括で書き換えたり可能

— posted by midilin @ 10:47AM | Comment (0)

【CSS】おしゃれなボックスデザイン（囲み枠）のサンプル30
https://saruwakakun.com/html-css/reference/box

— posted by midilin @ 10:14AM | Comment (0)

div[id*="About"] { /* セレクタ名の部分一致 */
 margin: 10px;
 border: 1px solid #f90;
}

https://bashalog.c-brains.jp/12/03/06-235258.php

— posted by midilin @ 10:08AM | Comment (0)

Visual Studio Codeを使う。
参考）
https://1-notes.com/visual-studio-code-css-formater/

「CSS Formatter」というのがあり、Shift + Alt + Fで整形

あとは、beautifyというのもある。
https://qiita.com/malmal0v0/items/9329b82209bf1d3266f7
「CSS Formatter」が動かない場合の代替で使える

— posted by midilin @ 12:20PM | Comment (0)

http://monopocket.jp/blog/css/1587/

— posted by midilin @ 10:33PM | Comment (0)

少しの労力でサイトをかっこよく！見出しのCSSデザインに役立つジェネレーター＆サンプル集30個まとめ
http://nelog.jp/wordpress-h1-h6

— posted by midilin @ 07:44PM | Comment (0)

CSSの「フレームワーク」　Bootstrap


HTML5アプリ作ろうぜ！（11）：Webデザイン初心者でもできる、Bootstrapの使い方超入門 (1/4) - ＠IT
http://www.atmarkit.co.jp/ait/articles/1403/19/news034.html


かっこいいボタンやタブなど、簡単にデザインできる。
またレスポンシブデザイン対応。


http://getbootstrap.com/
からダウンロードできる。

— posted by midilin @ 11:05AM | Comment (0)

・CSS3を使ってイントロアニメーションを作る
http://tympanus.net/Tutorials/SplashComingSoonPageEffects/index.html

demo1〜demo3まで３つサンプル有り
プログラムの説明は
http://csspro.digitalskill.jp/%E3%83%81%E3%83%A5%E3%83%BC%E3%83%88%E3%83%AA%E3%82%A2%E3%83%AB/css/css3-animation-intro/）


・CSS3アニメーションを使ったかっこいいページを簡単につくりたい！そんな人に -CSS3 Animation Cheat Sheet
http://coliss.com/articles/build-websites/operation/css/css3-animation-cheat-sheet.html

・文字の移動
https://developer.mozilla.org/samples/cssref/animations/cssanim1.html


・10分で作れる！初心者でも簡単にできるCSS3アニメーション　その１
http://oreweb-e.hatenablog.com/entry/2013/02/04/10%E5%88%86%E3%81%A7%E4%BD%9C%E3%82%8C%E3%82%8B%EF%BC%81%E5%88%9D%E5%BF%83%E8%80%85%E3%81%A7%E3%82%82%E7%B0%A1%E5%8D%98%E3%81%AB%E3%81%A7%E3%81%8D%E3%82%8BCSS3%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC
回転とかある。

・フェイドイン
http://builder.japan.zdnet.com/story_media/20406086/fadein01.html

・フェイドイン・フェイドアウト
http://blog.oukasoft.com/htmlcss/%E3%80%90css3%E3%80%91css3%E3%81%A7%E3%83%95%E3%82%A7%E3%83%BC%E3%83%89%E3%82%A4%E3%83%B3%E3%80%81%E3%83%95%E3%82%A7%E3%83%BC%E3%83%89%E3%82%A2%E3%82%A6%E3%83%88%E3%82%92%E8%A1%A8%E7%8F%BE%E3%81%97/

— posted by midilin @ 09:45AM | Comment (0)

スマホサイト作成時に、HTTPリクエストを減らすため、
必要な画像をひとつの背景画像にまとめ、
1つの画像で読み込み、
CSSで見える部分を制御する（部分表示する）方法がある。

これをCSS Spriteと言う。

背景画像のバリエーションや、ボタンなどを背景画像として
全画像を１つの画像で作成して表示することができる。

— posted by midilin @ 02:56PM | Comment (0)

・border-radius：丸角
・box-shadow、text-shadow：影つけ。box-shadowはinsertを使用することで内側にも影がつけられる（へこんでいるように見える）
・Gradients：グラデーション
・transform：図形を変形させる。（回転や歪ませるなど）
・transition、animation：アニメーション。
・transitionはシンプルな一定の変化のないアニメーション。
・animationはFlashでいうところのシェイプのようなもので、キーフレームという概念を持つ。

— posted by midilin @ 05:55PM | Comment (0)