HTML
Rick Astleyが現在の個人的大本命のマイブーム。 によって、ファンページを作ってしまうあたりがweb1.0時代な感じです。 作り方説明とか蛇足だから、いらない。と思って書いてなかったんですが、 案外、需要があるようなので記載しておきます。ページを作る…
「夏季限定・かき氷」ちょっとした涼のために大変な時間をかけてしまいましたが、 お楽しみいただければ幸いです。 画像：Illustrator＆Photoshop（CS） アイコンの画像置換：JavaScript（ロールオーバー） HTML+CSS（ながら入力で概算1〜2時間） 画像作るの…
HTML+CSS+いつもの宿題 HTMLもCSSも、プレビューしては、 これが足りない、これを直そう、で記述が増え…完成気分にはならず。
ひたすらHTML+CSSで1日目の続き なんか時間かかってます。 早くできるようにと小技を探してるのが かえって時間食ってるような。
サイト構成のツリー図（手描き） HTML打ち込み（ひとまずHTML5で宣言） CSS書き wpに移行する準備 進んだ! 気分が乏しい…。 千里の道も一歩から、と唱えながら作業。
まず基本のHTMLを書く <html lang="ja"> <head> <meta charset="UTF-8"> <title>Google Maps JavaScript API サンプル</title> </head> <body> <p>Google Maps APIを使ったサンプルです。</p> </body> </html> JavaScriptの指定 <html lang="ja"> <head> <meta charset="UTF-8"> <title>Google Maps JavaScript API サ…</meta></head></html>
元ソース→css以外の変更点 HTML構文内のclass抜けに追記 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />…</meta></head></html>
『freeweb』にアカウントだけ取っといたので、 ブログ形式ではない記述のデータを置いていくことに。 サイトタイトルは あしたのために打つべし！ 入力した結果ばかりを置いてあるので、これしかないなと。 画像がスゴイことになっているのはもうご愛嬌で（…
Google Chromeに『HTML5 Outliner』をインストール。 文書構造が正しく階層化されているか確認できる。コーディング的にもユーザビリティ的にも配慮の行き届いたページ作りを心掛けたい。構造比較でソースを複数掲載。 テキスト元『【HTML5課題18】文章を内…
従来、 <div id=""> で記述してきた内容を指定するhtml5新参タグ <nav> <header> <footer> は、ちゃんとhtml5の記述にする。 <h1>見出し1</h1> <p>本文</p> をレイアウト的に使うときは、 <article> <div> <h1>見出し1</h1> <p>本文</p> </div> </article> で囲んだ中に、必要であれば従来の<div>で指定をし、 見出しと本文を記述する。 <section> は、従来の <div class=""> 指定と差し替</div></section></div></footer></header></nav></div>…
CSSがエンベッドだったので、外部ファイルにして、 授業で加えたアレンジが反映されるように修正。 @charset "utf-8"; a { color: #017acd; } /* コンテナ */ div#container { width: 760px; margin-left: auto; margin-right: auto; } /* ヘッダー */ heade…
ビミョーなままってのもなあ、と思いつつ。 画像対策はできて、結局bodyに背景を置くにあたって、 bodyの背景色と同色で背景作った画像を置いたら解決。 ↓こんな見た目です。黒いほう(右側)が解決した画像。 キャッシュだったようですね。 もう木曜日なんだ……
居残りしたりごめんね先生…。 Microsoft Expression SuperPreview 4 Trialで確認したら、 左下の画像はcss読み込みで克服できたので、これだけイキにしました。 IETesterはビミョーな表示でしたが、また明日確認ということでひとつ。 右下の黒背景画像は、GI…
掲載URL→http://www43.atpages.jp/grave/index.htmlサイトカンプから紆余曲折を経て、実現しました！ というか、今できることで破綻なく表示できるページの完成です！これできるならあれやめなくてもよかったんじゃ、 って部分もありますが、今回これで達成…
特にサイドバー。 画像がうまく表示されなかったり、長さが合わなかったり。 もうひと頑張り。
金曜の授業中に入力できたところまで。 <html lang="ja"> <head> <meta charset="UTF-8"> <title>Green and Plain</title> <link href="green_base.css" rel="stylesheet" type="text/css"> </head> <body> <div id="header"> <div id="title"> <img src="images/img03.jpg"> <h1>Green and Plain</h1> <h2>Design by Free CS…</h2></div></div></body></html>
<html lang="ja"> <head> <meta charset="UTF-8"> <title>掃苔</title> <link rel="stylesheet" type="text/css" href="base.css"> </head> <body> <div id="container"> <div id="wrapper"> <div id="contant"> <div class="grave"> <img src="img/sengakuji_09.jpg" width="500" height="343" border="0"> …</div></div></div></div></body></html>
Illustratorを用いた画像課題とHTML01をまとめて掲載。Illustrator課題→http://d.hatena.ne.jp/web-css-design/20120418 HTML課題→http://d.hatena.ne.jp/web-design-advance/20120428/p1i-modeロゴ 解答は答え合わせで見る。 あえて下絵なしで作っているの…
