Studyblog

webデザインの勉強

途中までLP模写をした感想

こんばんは〜

今日は2つ連続で書きます!

バナー模写して、そのままLP模写一気に進めたからすごい疲れた〜。

 

今回模写しているのは「hiroproblog」というブログに載っていた、初級レベルの

ブログ型LPです。

hikopro.com

 

簡単だというものの、実際模写するwebサイトを見てみると

検索窓が飛び出すだとか、ドロップダウンメニューを作るだとか

初心者にとっては結構内容は濃いです。

 

しかも私はJavascriptでまだそこまで勉強できてないので

全てHTML/CSSで実装しました。

調べながらやったのでとても骨が折れました。

 

レイアウトに関しては『HTML5&CSS3 デザインブック(エビスコム著)』

を読んでおいてよかったと感じました。

 

 

しかし、 4つの要素をflex boxで横に並べようとしたところ、

均等に並んだのですが、高さがそれぞれ少しずつずれていて

flexの値を個別に変えたりしましたが、要素の大きさが同じようにならないので

結局marginで調整しました。

 

検索窓とドロップダウンメニューに何日も苦労してたので

全て作ることはできませんでしたが、

今日中に作り上げたいです。