HTML&CSS
久々のサイト作りで、当方のMacでは綺麗な組みもIE7以下では、崩れてしまっていたのが発覚。。。（泣） どうすればいいんでしょう。。。？ああ、古いIEなんてもう捨ててしまいたい。 IEがらみで、便利そうなのでメモっとく。 CSS3をInternet Explorer9以前の…
いよいよ最後の1週間。 卒制予定のCAFEのオーナーからの原稿は届かず、予定変更でポートフォリオを作成しているが、過去10年間の整理をやりつつなので、牛歩のごとく。 こんなに時間がかかってちゃ、とても仕事にはならないな。 何より，10P埋まるのだろうか…
HATENAのブログとTwitterの連動のテストです。●hatena-moduleとして記述 <div id="twitter_div" class="hatena-module"> <div class="hatena-moduletitle"> <a href="http://twitter.com/アカウント名">Twitter Updates</a> </div> <div class="hatena-modulebody"> <ul id="twitter_update_list"></ul> </div> </div>
DW「挿入」の「spry」 DWのjQueryのような機能。 テンプレート ページの再利用が可能 ページ内の変更箇所を制御することで、より安全なサイト制作が可能 新規作成時に、レイアウトから選んでアレンジ使用出来る。 短安な仕事の場合は、こういうのを利用する…
これから作るカフェのサイトや後々の事を考えて、ロリポップのドメイン名を変更する。問い合わせたら，データはそのまま移行されるそうだ。 当然ながら、しばしパンダカフェ等のサイトが見れなくなった。 せっかく作ったWPのサイトが、無事に移行してくれて…
Little-Boxes-Menu-with-jQuery <html> <head> <title>Little Boxes Menu with jQuery</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> </meta></head></html>
休日は、パンダカフェをいじっていました。 とにかくリンクを埋めないと、次のWordpressに気分的に進めなかったので。 8割は出来ましたが、どうも未解決な所が出て来て、相当な時間を費やすも分からず・・・。 パンダカフェ｜茶の花 【つまづき課題】 ◎menu…
CSS3 凄いな、CSS3。角丸も、グラデーションもドロップシャドウも全てCSSで作れる事に感激しました。 これは、是非頑張って覚えたいです。 ポラロイド ポラ画像がでかすぎたかも。 © Luc Viatour (CC BY-SA 3.0)
HTML５にてグリッドレイアウトの練習。 今週から、HTML5に入った。今まで学んだ知識の上に上書きされそうだけど（汗）、時代がそう流れるならしっかりと学んで行きたいと思う。 年末進行の諸々で、なかなか復習が出来ないが、グリッドを完成させねば・・・。…
リキッドレイアウト・・ブラウザのサイズ等で表示領域の幅がある程度変更されても、従来のレイアウトを維持できるようにする手法のこと。 ◎ 2カラムリキッドの練習 ◎3カラムリキッドの練習 ◎可変幅の３カラムサイト（テキスト5−2） メモ ◎ゲーム系の主流はこ…
授業内に出来ませんでした・・・。 風邪をひいたらしく熱っぽいので、後日課題はアップします。 サンプルスタイルシートカンパニー @charset "UTF-8"; /* CSS Document */ *{ margin: 0; padding: 0; } img { border:none; vertical-align:bottom; } ul{ lis…
「MY ALUBUM」のサイト構築の完成。 @charset "utf-8"; /* CSS Document */ * { margin: 0; padding:0; } ul, a{ text-decoration: none; } img { border: none } body { font-size: 0.8em; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro"…
anticaサイトの構築 課題サイト 「antica」 Flash 簡易スロット this.onLoad = function() { this.num1_mc.stop(); this.num2_mc.stop(); this.num3_mc.stop(); } _root.start_btn.onPress = function() { _root.num1_mc.play(); _root.num2_mc.play(); _roo…
今日は、代理の先生でした。 昨日「IE Tester」でcakeshopのサイトを見たら、IE6だけがセンターにならずにサイドバーが落ちて崩れていたので、その修正をする。（1）リセットにzoon:1;を入れる。 *{ margin:0; padding: 0; zoom:1; }（2）body{text-align:ce…
課題のcakeshopは、出来上がってるんだけど、大問題が解決しない。footer部分が、なぜかFirefoxだけ表示されない。DreamWeaverの画面でも，GoogleChrome,Opera,Sfari,Device Central上では問題無く見える。 でも、Firefoxだけが出てこない・・。何故？？？ …
◎jimdoの作成。Fhotoshopでのバック画像作り。 2日悩んだ見出し文字の問題が、ここを見て解決した！ 独自レイアウトのhtml ◎formのラジオボタン、チェックボックス、メニュー型の練習。 Googleドキュメントのフォームが，結構使える。 簡単に作成できて、メ…
今日は、頭がこんがらがった・・ ◎＜form＞〜＜/form＞がひとつのフォーム ◎通常ひとつのサブミット（実行）ボタンを持つ。 ◎入力部品に値を入力した後サブミットボタンを押すと、method 属性で指定した転送方法で、action 属性で指定したアクションを呼び出…
position static ●基準値。特に配置方法を指定しない。 ●この値のときには、top、bottom、left、rightは適用されない。 relative ●ブラウザの左上が基点となる。 ●top.leftで指定する。 absolute ●親ボックスにpositionのstatic以外の値が指定されている場合…
SS Spriteの縦型の練習。縦51PXで作ってみました。 @charset"UTF-8"; *{ margin: 0; padding: 0; } body{ background-color: #fff; } #nav { width: 200px; height: auto; margin: 50px 0 0 50px; } #nav ul{ list-style-type: none; } #nav li{ float: left…
イラストレーターで起こしたボタンで、SS Spriteを制作。 どうして一枚の画像で、影分身の術が出来るのかいまだに不思議です・・・。ボタンは、個別に作るより、まとめて作った方が良いそうです。↓猿頭なので、まとめてみました ◎イラストレーターはアンチエ…
body背景の設置 background-repeat: repeat; /* 画像の繰り返し */ background-repeat: no-repeat; /* 画像の繰り返さない */ background-repeat: repeat-x; /* X軸方向に画像の繰り返し */ background-repeat: repeat-y; /* Y軸方向に画像の繰り返し */ 画…
* ナビゲーションは、各ページへのリンクをまとめたものでありリンク集のひとつである * 項目を列挙したものといえる * リンクの価値は同質なので、番号のない箇条書きとして扱うボタンとして反応させるには、「面積」の設定が必要 #nav li a { display: blo…
ナビゲーションをつくるとき、必ず設定するのが「擬似クラス」◎ a href="#"←＃を使うと、エラーになる飛び方をしない。 (ヌルリンク）指定されてないリンク ◎ list-style-type:none ←ulに対して指定（liの方では無い） ◎ div#nav ← divを取るのは、スピード…
今日は、floatを使った段組みレイアウトとイラストレーターの練習でした。 唯一使えるイラレで、なんと間違ったやり方を長年していた事が判明〜。 他にも、いっぱいありそうな・・・。 floatの段組みレイアウト(10PXの余白があるレイアウト) ↑相当こんがらが…
<html xmls="http://www.w3/org/1999/xhtml" lang="ja"xml:lang="ja"> <head> <meta http-equiv="Content-Style-Type" content="text/html;charset=UTF-8" /> </meta></head></html>
練習1（エンベット） <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> </head></html>
本日は、ccsとイラストレーター。 初めてGIFアニメを作りました！嬉しい〜。楽しい〜♫ 文字サイズ よく使うのは0.875＝14px 文字と写真の間は、最低1,5em開ける． ◎HTMLが間違っていると、CSSがあてはまらない。 1：最初に文法チェック（必須！） 2：スタイ…
休みに一つだけやったのを貼付けます。 初めて見よう見まねでやったcssなので、今日ダメだと言われたgreenとか使ってますが・・。考え方は、これで良いのでしょうか・・・・？ <html> <head> <meta charset="UTF-8"> <meta http-equiv="content-Style-type" content="text/css"> <meta http-equiv="content-script-type" content="text/javascript"> <style type ="text/css"> </meta></meta></meta></head></html>
問題意識を持った人程、答えを出せる 時間の使い方を考えて、イメージを持ったライフスタイルを持つのは、とても大事である。長いビジョンと短いビジョンを持つ。今日の先生の格言。今日は、何だか濃い授業でした。 DTPの話は、大変参考になりました。もとも…
H１の下の一番最初のPに命をかけろ！ 以上、本日の先生の格言でした。卒業生の方が来て、ためになる話をして下さいました。 Web Developerを入れる 「Web Developer」 Fire Foxの機能で、HTMLやCSSの編集に役立つ強力なツール。CSSの無効化とか、出来るらし…
