KATインターン4回目

こんにちばんわ!先日KATのインターン、4回目が行われました!

 

まずはタイピングをしまして、その後はCSSを学びました。

 

 

タイピング。。家でパソコンに全く触れないせいか速度が衰えてきてます。。

ついさっきWiFiが自宅に到着したのでこれを機に毎日とは行かないと思うけどコツコツ練習やってきたいです。

 

 

今日はCSSを主にやったのですが実際にいじってみて、HTMLで全てを打つよりもはるかに楽…

HTMLだと1つ1つ文字をフォントサイズ色等を設定しなきゃならないのに、

CSSはHTML内の指定した文のまとまりごとに

変えれたり、まあ比較的打つ文字が少ない。うれしい。

 

後で見返したときに、前やってたけどこのCSSとは何ぞやとなりそうなので、ググッておくと

Webページのスタイルを決定することだそうです。主にデザインやレイアウトなど、見た目に関する指定が行われているそうで。

 

 

時々Webページの読み込みが上手くいかないときなどガラケーでサイトを見た時のような、背景真っ白の文字ばっかりが表示される状態が

CSSがきちんと適応されていない場合のサイトの状態なのです。

(Wikipediaみたいな感じを想像したら分かるかも!)

私は今まで何回かなったことあったので、見やすいページを作るためにCSSは大事なんだなと感じました

 

f:id:yamayuma:20190315232012j:image

書く時の主な用語

セレクタ  とはHTMLで指定しておいた要素のこと。どの部分を変えるかみたいな

プロパティ   とは何を変えるか。入る言葉はcolor,size,など

値   とはどういう風に変えるか。(色だとred、sizeだと24pixelなど)

 

基本の説明をうけて

CSSで下の画像のやつを打ってみて自分のサイトを確認してみようと。

したの…ですけど。色は変わったのですけど実は指定した色ではないのでした…

f:id:yamayuma:20190315232501j:image

最初は赤青緑で打ったのですけど、好きな色でしたいなとか思って、たぶん更新する前に赤オレンジ紫(勿論打つのは英語で)に変えたのですけど何故か反映されない…

インターン中ずっと眺めてましたが間違いがわからず。まあ別に最初は黒だったし一応色は反映されてるからいいかと諦めました

もしかしたら1番最初調子悪くて再起動したとき出遅れてしまったから何かしら打ちそびれた文字があった…の…かな??

隣の人のみても違いがわかんなかったですけれども。次いじるときに詳しく調べてみます

 

その後はプロパティ(例えば色や大きさなど)を増やしてみて遊んだりしてました。

 

次に同じセレクタを違うスタイルにするといったことをやってみて

f:id:yamayuma:20190315234702j:image
f:id:yamayuma:20190315234707j:image

最後はボタンを実装してみました(*^^*)

いつもサイトとかにいって、クリックしてるあのボタンです。こんなふうな。

f:id:yamayuma:20190315235434p:imageどういう風に作られてるかなんて全く知らなかったので、適したデザインにするために数値とか色々計算しなきゃいけないので意外と大変なのかなとか考えてました。

調べてみるとCSSだけでなくPhotoshopとかでも作れるのですね。デザインするのとか好きなのでいじりがいがありそうです😊

 

今回はこの辺にします!

自分でつくったサイトがある程度ちゃんとできたらURL貼ります!

 

それでは!