diff --git a/css1.css b/css1.css new file mode 100644 index 0000000..fa64972 --- /dev/null +++ b/css1.css @@ -0,0 +1,276 @@ +/* +//////////////////////////////////////// +reset.css を読み込んで全てのスタイルをなくす +//////////////////////////////////////// +*/ + +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, +body, +div, +span, +applet, +object, +iframe, +h1, +h2, +h3, +h4, +h5, +h6, +p, +blockquote, +pre, +a, +abbr, +acronym, +address, +big, +cite, +code, +del, +dfn, +em, +img, +ins, +kbd, +q, +s, +samp, +small, +strike, +strong, +sub, +sup, +tt, +var, +b, +u, +i, +center, +dl, +dt, +dd, +ol, +ul, +li, +fieldset, +form, +label, +legend, +table, +caption, +tbody, +tfoot, +thead, +tr, +th, +td, +article, +aside, +canvas, +details, +embed, +figure, +figcaption, +footer, +header, +hgroup, +menu, +nav, +output, +ruby, +section, +summary, +time, +mark, +audio, +video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { + display: block; +} +body { + line-height: 1; +} +ol, +ul { + list-style: none; +} +blockquote, +q { + quotes: none; +} +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ""; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} + +/* +//////////////////////////////////////// +reset.css では足りない初期化を追加 +//////////////////////////////////////// +*/ + +/* 全てに box-sizing: border-box; を適用 */ +*, +*:before, +*:after { + box-sizing: border-box; +} + +/* 画像に関する初期設定 */ +img { + /* 大きい画像がはみ出さないように */ + max-width: 100%; + /* 画像周りの無駄なスペースができないように */ + vertical-align: bottom; +} + +[data-whatinput="mouse"] *:focus, +[data-whatinput="touch"] *:focus { + outline: none; +} + +input, +textarea { + font-family: inherit; +} + +/* +//////////////////////////////////////// +初期設定 +//////////////////////////////////////// +*/ + +body { + padding: 32px 0; + color: #56564f; + font-family: sans-serif; +} + +article { + width: 640px; + margin: 0 auto; +} + +/* +//////////////////////////////////////// +以下に自分なりのCSSを書いて読みやすくする +//////////////////////////////////////// +*/ + +h1 { + font-size: 2em; + font-weight: bold; + text-align: center; + line-height: 1.4; + margin-bottom: 1em; +} + +h2 { + font-size: 1.5em; + font-weight: bold; + line-height: 1.4; + margin-bottom: 0.5em; + border-bottom: 1px solid gray; +} + +p { + line-height: 1.8; + margin-top: 1em; + margin-bottom: 1em; +} + +ul { + list-style-type: disc; + padding: 0.5em 0.5em 0.5em 2em; +} + +ol { + list-style-type: decimal; + padding: 0.5em 0.5em 0.5em 2em; +} + +ul li, +ol li { + line-height: 1.4; + margin-bottom: 0.5em; +} + +blockquote { + padding-left: 1em; + margin-bottom: 2em; + border-left: 7px solid #ccc; +} + +img { + width: 40%; + display: block; + margin: auto; + border: 1px solid #ccc; + border-radius: 4px; +} + +label { + width: 104px; + display: inline-block; + font-weight: bold; + text-align: right; + vertical-align: middle; + padding-right: 0.5em; +} + +input[type="text"], +textarea { + width: calc(100% - 130px); + padding: 0.5em; + border: solid 1px #aaa; + border-radius: 4px; + vertical-align: middle; +} + +.form-items__item { + margin-bottom: 1em; +} + +input[type="submit"] { + display: block; + margin: 0 auto; + background-color: #4397de; + color: white; + font-size: 16px; + font-weight: bold; + width: 200px; + height: 40px; + border: solid 1px #4397de; + border-radius: 4px; +} diff --git a/css1.html b/css1.html new file mode 100644 index 0000000..bf8d44c --- /dev/null +++ b/css1.html @@ -0,0 +1,57 @@ + + + + +
+

このページのタイトル

+
+

このセクションの見出し

+

段落文章文章文章文章文章文章文章文章文章文章文章文章、文章文章文章文章文章文章文章文章文章文章文章文章文章。

+

段落文章文章文章文章文章文章文章文章文章文章文章文章、文章文章文章文章文章文章文章文章文章文章文章文章文章。

+

段落文章文章文章文章文章文章文章文章文章文章文章文章、文章文章文章文章文章文章文章文章文章文章文章文章文章。

+ +
+

引用文段落文章文章文章文章文章文章文章文章文章文章文章文章、文章文章文章文章文章文章文章文章文章文章文章文章文章。

+
+
+
+

このセクションの見出し

+

段落文章文章文章文章文章文章文章文章文章文章文章文章、文章文章文章文章文章文章文章文章文章文章文章文章文章。

+
    +
  1. 箇条書き箇条書き箇条書き箇条書き箇条書き箇条書き
    2. +
  2. 箇条書き箇条書き箇条書き箇条書き箇条書き箇条書き
    3. +
  3. 箇条書き箇条書き箇条書き箇条書き箇条書き箇条書き
    4. +
+

段落文章文章文章文章文章文章文章文章文章文章文章文章、文章文章文章文章文章文章文章文章文章文章文章文章文章。

+ +

段落文章文章文章文章文章文章文章文章文章文章文章文章、文章文章文章文章文章文章文章文章文章文章文章文章文章。

+
+ +
+ diff --git a/markdown_practice.md b/markdown_practice.md new file mode 100644 index 0000000..2d2d4dd --- /dev/null +++ b/markdown_practice.md @@ -0,0 +1,56 @@ +# カレーのレシピ + +誰でもできる、美味しいカレーの作り方です。旦那も息子もこのカレーが大好物。 +ポイントは玉ねぎと人参はミキサーで細かくしてしまうところ。逆にコクのある美味しいカレーになります。 + +## レシピの作者 + +山田サチ子さん + +## 材料 （ 8皿分 ） + +* 豚肉(薄切り) 300ｇ +* じゃがいも(中) ４個 +* ☆玉ねぎ ２個 +* ☆人参(中) 1本半 +* ☆にんにく ２個 +* ローリエ ２枚 +* 市販のカレー粉（２種類合わせて）１箱分 + +## 調味料 + +* ガラムマサラ 大２ +* こしょう 小１ +* ハチミツ 大４ +* 中濃ソース 大1 + +## 作り方 + +1. ☆を2回に分けてフードプロセッサーにかけます。 +2. ジャガイモは角をとっておきます。 +3. 油をしいた鍋で豚肉を炒めます。少し白くなってきたら、塩コショウをして炒め、更にお酒を加えて水気がなくなるまで炒めます。 +4. 鍋に☆を加え少し色が変わってきたら塩コショウします。 +5. 水分がある程度飛ぶまで炒めます。(結構時間がかかります) +6. そこにジャガイモを取った角ごと入れ、簡単に火を通します。 +7. 水を加えます。ついでに、フードプロセッサーもキレイに！ +8. 鍋に水とローリエを加え焦げないよう、たまにかき混ぜながら20〜30分弱火で煮ます。 +9. 火を止めてカレールウを入れて混ぜ、再度火をつけます。 +10. １０分位煮立て、更に調味料を入れて１０分位煮込みます。 +11. 味が整ったら火を消し完成。※この時点で多少スパイスがキツくても、置いておけばマイルドになっているので大丈夫です！ + +## ポイント + +甘さと辛さの調節はコショウとハチミツで！コショウで辛口に、ハチミツで甘さとコクを出します。 +焦げやすいので、まめにかき混ぜて下さい。ルウを入れた後はお水を足しながら緩さ調整して下さい。 + +## このレシピの生い立ち + +野菜嫌いなる主人、息子に野菜を食べてもらおうと、玉ねぎと人参はフードプロセッサーにかけ除けられないようにしたところ、これが我が家のカレーの定番になりました。 + +## コメント + +うちでも試してみました。とても美味しかったです。ありがとうございます。 +投稿者 岩鬼正美さん + +うちの息子も野菜嫌いなのですが、このカレーは美味しく何度もおかわりしてました。 +投稿者 殿馬数人さん