CSS

【CSS01】CSS課題:文字の修飾

CSS

<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>

【CSS02】CSS課題:文字の修飾

CSS

<html xmlns="http://www.w3.org/1999/xhtml"xml:lang="ja" lang="ja"> <head> </head></html>

【CSS03】CSS課題:文字の修飾

CSS

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang:"ja"> <head> </head></html>

【CSS04】CSS課題:文字の修飾

CSS

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS" /> <title>【C…</meta></head></html>

【CSS05】CSS課題:文字の修飾

CSS

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang:"ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS" />…</meta></head></html>

【CSS05】CSS課題:文字の修飾

CSS

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang:"ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS" />…</meta></head></html>

【CSS04】CSS課題:文字の修飾

CSS

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS" /> <title>【C…</meta></head></html>

【CSS03】CSS課題:文字の修飾

CSS

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang:"ja"> <head> </head></html>

【CSS02】CSS課題:文字の修飾

CSS

<html xmlns="http://www.w3.org/1999/xhtml"xml:lang="ja" lang="ja"> <head> </head></html>

【CSS01】CSS課題:文字の修飾

CSS

<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>

Webサイトの模写

TemplateWorldから、練習。 ↑ こっちが見本で… ↑ こっちは模写品。 崩れまくり! 修正をします。

練習01

やっとこ、1つ完成。 つまづいて、なかなか修正出来なかった部分を記録。 1行にまとまらず、改行の様になっていた。→文字の大きさが違っているのか、フォントが違うのだろうと思い、チェック。思った通り、フォント違いで、タグの綴りが間違っていた。 右揃…

メモ

CSS

background-color は、背景色を指定するプロパティです。インラインフレーム内の文書にこのプロパティ(値 transparent)を設定すると、インラインフレームの背景を透過させることができます。 Firefox、Safari、Chromeは、この指定がなくても透過されます。…

テーブルの練習

テーブル1のHTML <p>テーブル1</p> <table id="table1"> <tr> <td class="width1">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td class="width2">&nbsp;</td> </tr> <tr> <td class="width3">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbs…</td></tr></table>

復習

vertical-align・・・プロパティは、行のなかでのテキストや画像などの縦方向の揃え位置を指定する際に使用します。 ただし、これが適用できるのは、インライン要素とテーブルセルであり、ブロックレベル要素には適用できません。

文字サイズfont-size

CSS

文字サイズfont-sizeに関して。 値には、次の4種類がある。 絶対サイズ(xx-small,x-small,small,mediam,large,x-large,xx-large) 相対サイズ(larger,smaller)絶対サイズを基準としてlargerは1段階大きく、smallerは一段階小さく表示される。 数値:単位…

NoneStyle

先生、NoneStyleのソースコードをアップしていただき、ありがとうございます。 自分が作成したものと比べてみると、笑えるほど違っていました・・・。 修正をしながら、もう一度作成してみたいと思います。 修正前のHTMLとCSSです。http://www.w3c.org/TR/xhtml…

練習

製作時間:3時間どうしても右サイドの記事に、下線をつけることができず・・・。 とりあえずは、ここまで・・・。

練習

まだまだ、勉強が足りません・・・。「カラム落ち」、というらしいです。 それぞれの段を左右に並べてみようかと思うのですが、Newsの欄が下になってしまいます。しかも、フッタもおかしい。これで調べました。↓ まだ、読みかけです。 現場のプロから学ぶXHTML+…

練習

先生のサイトより、素材をダウンロードしました。まずは、HTMLを作成してみます。

参考書で練習その5

生まれて初めて、「歯」を抜きました。 親知らずです。やっぱり、ペンチみたいなものでぐりぐりっ・・・と抜くんですね・・・。 いやはや。 なんとも・・・。 この時点では、まだ、レイアウトが崩れています。 ので、もう一歩、進んでみました。 ↓ なんとか…

参考書で練習その4

背景まで入れてみました。 なぜか、背景右に、線が入っています。 どこが間違っているのか、どこを直せばこの線が消えるのか・・・。検証には、とてつもなく時間がかかりそうです。

参考書で練習その3

先日、上のねんねの消防署見学でした。 が。 前日にお休みをして保育園に行かなかったので、今日の行事のことをまったく知らずじまい。 あさ、保育園へ連れて行ったときにはじめて発覚。「ひえぇぇぇぇぇぇっ!(これは私の声)」ねんねの組はすでに出発した…

floatを使う

Dreameaverの使い方を学びつつ、HTML、CSSも同時に学習。 ポイント HTMLでの <ul class="thumbnail"> <li>〜</li> <li>〜</li> ・ ・ ・ </ul>↓ CSSでは「ul.thumbnail」と指定する。また、これらのli(リストアイテム)を横に並べたい場合は、floatを使用する。 ※float・・・上に浮き上がり、回りこむ。 ul.t…

CSSに関して

CSS

前回の授業で、「外部」「スタイルシート」と先生がおっしゃっていたのをもとに調べてみました。CSS(Cascading Style Sheets=カスケーディング・スタイルシート) HTMLではスタイルシートと言えば、CSSのことを指しているのが一般的。 CSSをHTMLに適用させ…