プログラミングとcssに関するnattsun829のブックマーク (3)

  • 【第4弾】少しのコードで実装可能な10のCSS小技集

    2021年3月4日 CSS CSS小技集シリーズの第4弾!「【第3弾】少しのコードで実装可能な15のCSS小技集」から約2年。またまた便利でサクッと使えるコードが続々登場しています!初心者さんからベテランさんまで要チェック! ↑私が10年以上利用している会計ソフト! 目次 要素の上下左右中央配置 画面幅いっぱいに画像を配置 リストマーカーの色を変える 言語にあわせて引用符を変更 クリックで文字列を選択 背景画像を見切れないよう繰り返し表示 入力時の縦線の色を変更 ドラッグで要素のサイズを変更できるようにする floatは flow-root で解除 文章をカラム分けしてラインを入れる HTMLCSSの全コードは各サンプルの「HTML」や「CSS」タブを、別タブでのサンプル表示は右上の「EDIT ON CODEPEN」をクリックしてご覧ください! 1. 要素の上下左右中央配置 ボックスを要

    【第4弾】少しのコードで実装可能な10のCSS小技集
  • 簡単CSSアニメーション&デザイン20選(ソースコードと解説付き) | knowledge / baigie

    CSSは使いようによっては様々な表現が可能な奥深い言語です。しかし、アニメーションなど凝った動きをするものに関してはコードは見れても実装方法を詳しく解説している記事は多くないように思えます。 この記事では、私(さかっちょ)がTwitterで過去にツイートしたCSS技術をCodePenで改めて実装し、Twitterでは解説しきれなかった実装方法をより詳しく説明しています。CSS初学者の方にもわかりやすいように解説していますので、ぜひ参考にしてみてください。 その1. 一文字ずつ登場するテキストアニメーション See the Pen [CSS Tips] Text Show-up Motion by Takuro Sakai (@sakaccho) on CodePen. 一文字ずつtransformで移動させています。文字が途切れることなく流れるようにtransition-delayを調整

    簡単CSSアニメーション&デザイン20選(ソースコードと解説付き) | knowledge / baigie
  • プログラミングスクールに通わず、プログラミングを学ぶ方法

    「プログラミングスクールってどう思いますか」への、個人的な回答メモ。 LINEのウェブ制作系のオープンチャットで、 「おすすめのプログラミングスクールはありますか?」 「エンジニア転職したいです。何からやればいいですか?」 「おすすめの勉強方法を教えてください」 など、プログラミング未経験の方によるこの質問から始まって、独学の方法についての意見交換が始まる展開を何度か見ている 初心者なのに数十万かけてスクールに通おうとしている人が多かったのが意外だったので、個人的な考えを長文でまとめたものである。 「リモート研修中にクビになった法政大の〜」という記事を見て、既視感があったので増田に貼る。 昨今のコロナ以前に書いたので、コミュニティの利用方法は若干今の現実と即してないと思う。 この文章は、ある程度の音と持論を語るために、あえて冗長な長い文章の形式をとっている。 なぜならば世間一般の「エン

    プログラミングスクールに通わず、プログラミングを学ぶ方法
  • 1