はてなブックマーク

深い意味は無いのですが、最近ブログに時間をかけるよりその分たくさんコードを書こうと思い始めました。 ササっと作って公開するなら、やはり手軽なのはHTMLやCSSです。 まずはこれらを使い、何でも良いので作っていこうと思います。 前回作った食べれないサンドイッチはこちら。 はじめに 今回つくるのは、これです！ みんな大好きはてなブログのロゴマーク。 公式素材としても配布されているこの画像を、CSSで表現していきます。 １．大まかな部品を構想する CSSでは1つの要素を複雑な形に変形させることができないため、作りたいものがある場合には、何を組み合わせて表現するかを考えておく必要があります。 HTML,CSSでは基本的に四角形を扱いますが、 枠線を利用して三角形や台形を作る 角を落として楕円形にする などの簡単な変形は可能です。 CSSの変形に慣れていない人は、こちらのサイトなどを見ながら、そも

というわけで作ってみました。 動くものは本文にあります。 作成時間は多分2時間程度です。 久しぶりにperspective(奥行き設定)を使ったところハマってしまいました。 ぶっちゃけcodepenを使いたかっただけです。 結果 こうなりました。 クロスブラウザ対応は一切していないので、一部ブラウザでしか動かないかもしれませんが仕様です。 回転ボタンを連打するとくるくる回ります。 空腹欲はおそらく満たしてくれません。 材料はパンとハムときゅうりだけです。パンは若干トーストしてあります。 せめてトマトとかレタスくらい入れるべきかと思ったものの、そんな気力はありませんでした。 もっと贅沢なのが好きな人は、自分で改造してみてください。 とっても手軽で非常に便利なので、皆さんもHTMLやCSSをさらっと書きたい時にはcodepenを使いましょう。 codepen.io なんという手抜き記事。 解説

私は自分自身を結構ポジティブな人間だと思っている。 しかし、世の中にはポジティブシンキングができず、ものごとを常にネガティブに捉えてしまう人が多くいるらしい。 ポジティブシンキングと、ネガティブシンキング。 果たしてその違いは、どこにあるのだろうか。 雨に濡れた本 まずは昨日の私の話をする。 この頃の私の興味は、もっぱらゲーム制作だ。 個人で作れて、自分でやっても楽しくて、なおかつお金になる可能性がある。 普段の業務でプログラミングを行っていることもあって、Unityという最高に便利なゲームエンジンにのめり込むまでに時間はかからなかった。 最近ではUnityの本やらゲームデザインの本なんかを買いあさり、毎日必死に読みながら実践と学習を繰り返している。 「レベルアップ」のゲームデザイン ―実戦で使えるゲーム作りのテクニック 作者: Scott Rogers,塩川洋介,佐藤理絵子 出版社/メー

今回は、Webページを表示するために使うHTML、CSS、JavaScriptという3つについて、その関係と、それぞれで何ができるのかを説明していきます。 なるべく簡潔に、プログラミングに慣れていない方にも概要が伝わるよう書こうと思いますので、興味がある方はどうぞ。 【注意！】 この記事は、一般的な定義ではなく、私自身の言葉で説明する記事です。 ちゃんとした定義が知りたい場合は、W3Cなどのページを参照してください。 目次 目次 １．基本ルール ２．HTMLは存在を表現する タグの親子関係 タグの順番 タグの属性 ３．CSSは状態を表現する ４．JavaScriptは動作を表現する 補足１：CSSでの動作と、JavaScriptを使った動作の違い 補足２：開発者ツールを使おう！ さいごに １．基本ルール Webページで使う3つの要素の関係は、簡単に言うとこんな感じ。 HTMLは 存在 を表