こちらの記事で紹介されているショートカットの表記はきれいでいいですね。 WordPressの今のテーマで無理やりstyleタグをエントリー中に埋めたら以下のようになりました。 予想外にちゃんと表示されましたｗ body { padding:20px; height:100%; font: 20px h…

前回のエントリーの少し補足の記事です。 Twitter Twitterボタンは公式サイトだと以下の種類しかありません。 でも↓のような上に数字、下にボタンのスタイルもよく見かけますよね。 これを実現するには以下のように生成されたコードのaタグの中に「data-coun…

最近静的なＷｅｂページに自力でソーシャルボタンを張ったりしていたのでリンク先をまとめておきます。（自分のために） Twitter https://twitter.com/about/resources/buttons#tweet Facebook https://developers.facebook.com/docs/reference/plugins/like…

いろいろ作ったものを公開する実験的なLabsページを作成しました。 とりあえず、最近つくった3Dプリンターとギターのページがお勧め！ まだ今は暫定的な感じですが、今後も作ったものはどんどんこちらで公開していきたいと思います。

ギターのまとめサイト完成しました。 こちらで公開しています。 作曲とかでギターのフレーズを考える場合に使えるのではないかと思います。 ギターに興味のある方はぜひご覧ください。 背景にうっすら写っているのはマイギターです(^^)

この前作った３つのサイト（以下）ですが一度に全部表示できたほうが便利なので、がっちゃんこしたひとつのサイトを作成中。 HTML5のCanvasを利用してギターのスケールを表示 ギターの指板上の音名表示プログラム ギターのコード（和音）表示プログラム 豪快…

せっかくCSSを覚えたので忘れないうちに自分なりのテンプレを作ってみました。 こちらで公開していますので気になる方はご覧ください。 こんな感じのWebサイトです。少しフラットデザインっぽいかもｗ せっかくなのでソースも貼り付けておきます。 HTMLファ…

このページを結構苦労しながら手探りで作っていましたが、 やはり効率が悪すぎるので今更ながらまじめにCSSを覚えました。 今回はこの本をけっこうじっくりと読みました。実践的なサイト作りについて丁寧に解説されており大変参考になりました。 HTML&CSS標…

久しぶりに静的なWebサイトを作りました。こんなにまじめに作ったのは初めてかも。 3Dプリントしてみよう！ CSSにあまりなれていないのでレイアウトがかなり大変でした。あとWordPressだとプラグインですぐできるソーシャル系のボタンの追加を自前でしたりと…

スケールを表示するプログラムを少し改造して作りました。 以下は、Cメジャーコードのポジション例です。 プログラムは以下に置いています。 http://hi-rom.com/labs/guitar/chord/chord.html 好きなルート音を選んであとは、それに重ねる音(3rdや5thなど）…

HTML5のCanvasを使って昨日作成したこれを少し改造して作りました。 ■ギターの指板上の音名 http://hi-rom.com/labs/guitar/notes/notes.html ちょっと見にくいけど１フレット内にフォントを収めようとするとこのサイズになってしまいました。 あとは、コー…

こちらで少し書いたギターのスケールポジションを表示するやつ完成しました。 イメージ図。 実際使えるやつは以下に置いています。（少しWebのディレクトリを整理しなければ。。） http://hi-rom.com/labs/guitar/scale_disp/scale.html 今回は一応HTML5縛り…

ギターのスケールポジションをキーに合わせてさっと表示してくれるものがあると、作曲したりフレーズを考えたりする場合に便利かなと思い、半分思い付きでつくることにしました。 まずはイメージをさっとメモ。 概要は キーとスケールを選択するとそのスケー…