2019年8月– date –
-
LiquidLogicを使えばiPadでもプログラミング可能
自分は基本的にMacBook Pro(2015)でWebエンジニアに向けて学習とブログの更新を行ってるんですが、ちょっと出かけた時の隙間にも手持ちのiPad Proで作業できないかなぁと思いiOS用のエディタを探していていたところ、良い感じのLiquid Logicを発見したので... -
VSCode拡張機能Live Server設定内容まとめ
先日紹介したVSCodeの拡張機能の各設定内容をまとめました。 とはいっても自分のPCをサーバーにして、ブラウザでプレビューする場合はデフォルトの設定で良いんですけどね。 設定内容 起動するブラウザの設定(Advance Custom Browser Cmd Line) Live Serve... -
CSSで行間を変更する方法
前回のブログで要素間の隙間の話しををしましたが、それを解決するために自分は「CSS 行間 なくす」とかで検索してました。でも、昨日の話しは行間ではなくて要素間だったんですよね。 そこで今回は行間と要素間の違いと行間のコントロール方法をまとめて... -
CSSで要素間の隙間を埋める方法
またまたWebページの模写中にブロック要素とブロック要素の隙間ってなんやねんってなったので、調べた結果をまとめてみます。 Twittrでも悩みをつぶやきました。 このh1とpの行間ってmarginをマイナスとかしてなんとかするしかないの?ググって親要素のfon... -
wrapper?container?HTMLの構成を考える
ProgateのHTML&CSS道場コース上級編の完成ページを模写コーディングしてみました。 Progateの道場コースで同じページを作成していたこともあって、かかった時間としては半日ぐらいだったと思います。 模写コーディングの結果、divで囲む単位とかスタイルが... -
CSSでの要素のサイズ指定方法まとめ
模写コーディング中に要素の高さ指定で悩んだので、一度振り返ってみます。 前提 インライン要素にはサイズの指定はできません。インライン要素はテキストの内容、太さでサイズが決まります。 サイズ無指定(auto) 幅・高さを指定しなき場合はいずれも「aut... -
初心者が模写コーディングを開始するための準備まとめ
ProgateのHTM&CSSコースは一通りやったので、Webページの模写コーディングに取り掛かりました。 参考にさせて頂いたサイト HPCode - はにわまんさん https://haniwaman.com/replication-coding/ 模写コーディングのルールやfontや色、サイズを計測するChro... -
CSSでfloatで親要素の高さがなくなる問題と解決方法
ProgateのHTML&CSS道場コースをやっててfloatの解除やら高さが思うようにならないってので四苦八苦したので、調べた内容をまとめておきます。 floatプロパティの動作確認 floatプロパティを使用しない場合 まずfloatプロパティを使わずにdiv要素(div1)の中... -
CSSで要素をセンタリング(中央揃え)する方法
今日はhtml、CSSでの要素のセンタリング(中央寄せ)についてまとめます。 インライン要素とブロック要素の違い ブロック要素は要素の横幅が少ししかなくても横幅いっぱいに配置され、次の要素はブロック要素の下に配置されます(div、h1、pタグなど)。 一方... -
WordPressの構造の理解に入る前にやるべきことがあった話し
Webエンジニアを目指して勉強を初めて1週間ぐらいが経過しましたが、思うように進んでない気がしてるので、軽く振り返りたいと思います。 進んでない要因 WordPressでこのブログの環境構築してブログを始めたのは良いとして、HTML&CSSでレイアウトを作れも...
12