yuya

フロントエンド開発初級者

yuya

フロントエンド開発初級者

CSS勉強 - css grid

この投稿では、css gridを実際に触って得られた知見をメモしたものを並べている。 現在webの勉強会を数人で行っている。その中でcssについての勉強会があり、最後に宿題が出た。宿題は、redditの投稿を真似して作るというものであった。 私は興味があったcss gridを使って宿題に取り組んでみた。以下知見。 display: grid;指定した要素にグリッドレイアウトが適用される。 grid-template-rows、grid-template-columns

yuya

    • HTML勉強 - 既存のpageの再現で理解できたことと課題

      　今週は勉強のやり方を少し変えて、既存の画面を再現して、どの程度理解できたか確認してみた。参考にした画面は、業務に絡むものなので、ここに載せられないが、理解できたところと課題を載せておく。 環境には、vue-cli3とbootstrap4とfont awesomeが入っている。もともと勉強用に作ったプロジェクトで、vue-cli3とbootstrap4で作っていたものにfont awesomeを追加した。 以下理解できたところと課題。 理解できた点• 親要素と子要素の重

      yuya

      • HTMLの勉強で知ったこと 4

        前回の続き HTMLブックマーク長いWebページ内でのリンクを作成し、ページ内ジャンプが実現できる。 まず、何か要素にid属性を付ける。次に、他の要素にhref属性を付けて、事前に付けたidをリンクさせることで、ページ内ジャンプができる。 JavaScriptを許可しないブラウザに任意の言葉を表示することができる<noscript>タグを使うと、JavaScriptの利用を許可していないブラウザのみで表示する文字をhtmlに仕込むことができる。 <meta>タグでペー

        yuya

        • HTMLの勉強で知ったこと 3

          前回の続き HTMLリストのマーカーの種類変更HTMLリストのマーカーには、複数の種類があることが分かった。 【順序なし】 * disc : ● * circle : ○ * square : ■ * none : 無し 【順序あり】 * type="1" : 1,2,3,... * type="A" : A,B,C,... * type="a" : a,b,c,... * type="I" : I,II,III,... * type="i" : i,ii,iii,

          yuya

        CSS勉強 - css grid

        yuya