独学!Webサイト構築日誌

6日目:まずはバグ修正から。

8:30

寝起きでバグを見つけてしまい、朝から修正作業。眠い。
  1. 本文のリストを目立たせる。
  2. 日誌一覧に目標を載せる。
  3. お問い合わせフォームの作成。

9:30

既存のウェブサイトの整理もしてきます。皆さんには関係の無いお話で、実家の大掃除ぐらい時間を取られる作業。整理してると見たいものがワラワラ出てくるので、その誘惑に勝たないといけないという罠。

...くっ...辛いが終わらせよう。

あ。
問い合わせフォーム様はVIP待遇で後回しです。まだどうするか決めてない。

10:00

誘惑に打ち勝ち終了。

1.本文のリストを目立たせる。

cssで綺麗に装飾してあげましょう。参考サイト
            
/*リスト部分*/
#main ol {
width: 95%;
background:#FFFFFF;/*背景色*/
padding: 0.5rem 0.5rem 0.5rem 2.5rem;/*ボックス内の余白*/
border: solid 3px #00008B;/*線の種類 太さ 色*/
}
#main ol li {
padding: 0.5rem 0; /*前後の文との余白*/
}
            
        

11:00

2.日誌一覧に目標を載せる。

done.
            
html ※長いので一部抜粋
<div id="main" class="p-diary">   
<p><h1>日誌</h1>
<br><a href="/diary/day0.html">0日目:さて。</a><br>
<br><a href="/diary/day1.html">1日目:始めるぞ。</a><br>
<strong>大目標:これから1ヶ月以内(2020年12月末)を目安に、現在使っているこのブログのWebサイトを自分で構築できるようにする。</strong>
<ol>
<li>URLリンクをクリックしたら飛べる状態にする。</li>
<li>上部にメニューをつける。</li>
<li>進捗画像掲載。</li>
</ol>


css
/*日誌限定*/
.p-diary ol{
border:none!important;
}
.p-diary a{
font-size:200%;
}
            
        

続きは昼飯を食べてからだ!

12:30

別件でプログラム弄ってきますた、サクっと終了。

13:00

3.お問い合わせフォームの作成。

さて。問題のコイツですが…

19:00

とりあえず参考になりそうな本を何冊か購入し読んでいますが、防犯処理(?)も必要そうで、今のニワカ知識でやると痛い目を見そうなので、諦めてサーバー会社のメールフォームを使用させていただくことにします。

また、明日からはhtml、css、JavaScriptを復習する予定です、あまり急いで基礎を疎かにすると結局遠回りになりそうなので、明日からはそれらを使ってサイトを進化させていきます。


6日目の進捗状況。全体的な見た目は変わらず、日誌一覧が大きく変わったので掲載。



Before: 5日目

Before: 5日目

After: 6日目

After: 6日目



作成日:2020/12/18 - 更新日:2021/01/26

≪ 5日目≪ 一覧に戻る ≫7日目 ≫

HOME > 日誌一覧 > 6日目:まずはバグ修正から。