CSSの隣接・直下・間接セレクタの違いを現役エンジニアが解説【初心者向け】
隣接セレクタとは 隣接セレクタとは、基準要素の隣の要素を指定するためのセレクタです。 CSSでは以下のように記述します。 HTML <span>1</span> <span>2</span> <span id="me">3</span> <span>4</span> <span>5</span> CSS #me + span { background: gold; } /* #meの隣にあるspan */ 実行結果 4の背景色がgoldになります。 直下セレクタとは 直下セレクタとは、基準要素の1つ下にある子要素を指定するためのセレクタです。 CSSでは以下のように記述します。 HTML <div id="me"> <span>1</span> <div> <span>2</span> <span>3</span> </div> </div> CSS #me > span { backgr
【2016年の完全保存版！】フリーで使えるjQueryのプラグイン30選 | TechAcademyマガジン
【2016年の完全保存版！】フリーで使えるjQueryのプラグイン30選 フリーで使えるjQueryのプラグインをまとめています。jQueryは初心者でも扱いやすく最も普及しているJavaScriptのライブラリです。Webサイトの印象も大きく変わるプラグインばかりなので、ぜひ使ってみてください。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 本稿は、Designmodeのブログ記事を了解を得て日本語翻訳し掲載した記事になります。 本記事
【すぐに使える！】CSSのアニメーションをまとめたサイト・記事20選
【すぐに使える！】CSSのアニメーションをまとめたサイト・記事20選 初心者向けにCSSで書けるアニメーションをまとめたサイトや記事を厳選して紹介しています。Webサイトの制作において重要なアニメーションですが、すぐ使えるサンプルをまとめているので、ぜひ参考にしてみてください。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 今回はCSSのアニメーションをまとめたサイトや記事を紹介します。 サイトを作っていく上でアニメーションの実装は必須と
Photoshopのバッチでファイルを一括で処理する方法【初心者向け】現役Webデザイナーが解説
Photoshop（フォトショップ）で「バッチでファイルを一括で処理する方法」を初心者向けに解説した記事です。バッチ処理を使うと、画像のサイズを変えるといった同じ作業を繰り返して実行可能。Photoshopの効率アップにお役立てください。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 Photoshopで同じような作業を繰り返すときに、もっと楽にできればいいのにと思ったことはないでしょうか？ そんな時に便利なのが「バッチ」の機能です。 バ
TwitterのJavaScript APIを現役エンジニアが解説【初心者向け】
TwitterのJavaScript APIとは TwitterのAPIを使うためのJavaScriptインターフェースのことです。APIは「Application Programming Interface」の略です。APIとはある特定のサービスの機能やデータを、無料で外部サービスと提携して開発・整形して利用できるようになるものです。 今回のケースを平たく言うと、TwitterのアプリをJavaScriptというプログラム言語で操作するものという感じです。 TwitterのJavaScript APIで実現できる主なこと APIのリファレンスを見ることで、用意された機能の一覧が確認できます。 Twitter APIリファレンスはこちら 平たく言うと、普段Twitterを使うときにしている操作がAPIでできます。ツイートする、いいねを押すなどの操作です。 [PR] フロントエンドで副業する
JavaScriptでAPIを呼び出す方法を現役エンジニアが解説【初心者向け】
初心者向けにJavaScriptでAPIを呼び出す方法について解説しています。APIとは外部のサイトやプログラムから関数やメソッドを通してデータを取得出来るような仕組みのことです。データが変更されても同じ名前の関数やメソッドでデータを取得することが出来ます。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 JavaScriptでAPIを呼び出す方法について解説します。 実際のコードをもとに解説していきますので、理解を深めていきましょう。 ま
CSSだけでif文のような条件分岐を実装する方法を現役エンジニアが解説【初心者向け】
目次 条件分岐とは 一般的なプログラミングで使われるif文について CSSで条件分岐を実装するには 条件分岐を実装してみよう まとめ 条件分岐とは 条件分岐とはプログラミング言語の制御構文の１種で、なんらかの条件に基づいて処理を切り分けるものです。 [PR] Webデザインで副業する学習方法を動画で公開中 一般的なプログラミングで使われるif文について 例えばJavaScriptでは条件分岐はif文で記述します。 const i=0; if(i==0){ console.log('iは0です'); } else { console.log('iは0ではありません'); } 上記の場合、変数iの値が0の場合とそうではない場合で条件分岐を行っています。上記の場合は変数の値は0であるため「iは0です」と出力されます。 CSSで条件分岐を実装するには CSSで条件分岐を実装するにはCSSセレクタや
要素の中身を変える！JavaScriptでinnerHTMLの使い方【初心者向け】
要素の中身を変える！JavaScriptでinnerHTMLの使い方【初心者向け】 初心者向けにJavaScriptでinnerHTMLの使い方について解説しています。html要素の中身を変更したい時に便利な関数です。実際にプログラムを書いて、動きを確認することができるので、ぜひ書き方を参考にしてみてください。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査
HTMLとCSSだけでポップアップ表示を作成する方法を現役デザイナーが解説【初心者向け】
[PR] Webデザインで副業する学習方法を動画で公開中 HTMLに記述する内容 ポップアップを実装するため、まずはHTMLに下記を記述します。 表示させたいコンテンツ ボタン要素 <label> <span>popupを表示</span> <input type="checkbox" name="checkbox"> <div id="popup"><img src="https://assets.techacademy.jp/public/logo.png" alt="TechAcademy" /></div> </label> ポイントはinput要素のcheckboxを使用することです。 この事でcheckboxがチェックされたとき（クリックされたとき）のアクションを、CSSで制御することができます。 CSSに記述する内容 つづいて、CSSに内容を記述します。 CSSに記述する内容
2021年までに身につけると圧倒的に差がつくスキル3選
初心者向けに2021年までに身につけると圧倒的に差がつくスキル3選について解説しています。ここでは３DCG作成、時短リカバリー術、プログラミングについて説明します。それぞれを身につけることでどのような影響があるかを見ていきましょう。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 2021年までに身につけると圧倒的に差がつくスキル3選について、TechAcademyのメンター（現役エンジニア）が初心者向けに解説します。 今回の記事の内容は動
アクセスされているページが分かる！PHPでURLを取得する方法【初心者向け】
アクセスされているページが分かる！PHPでURLを取得する方法【初心者向け】 プログラミング初心者向けにPHPで現在アクセスされているページのURLを取得する方法について解説しています。$_SERVER変数を使うことでサーバーに格納している情報を取得することができます。書きながら覚えていきましょう。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 PHPでURLを取得する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコー
PythonのフレームワークBottleの活用方法【初心者向け】
フレームワークBottleとは Bottle とは、 Python で Web アプリケーションを作成するためのフレームワークです。 Web アプリケーションとは、 Web サーバでプログラムを動かし、ブラウザなどを介して利用するアプリケーションのことです。 Python で Web アプリケーションを作成することで、Python が得意とする数値計算や機械学習と連動させたアプリケーションの開発が容易になります。Python で Web アプリケーションを作成するためのフレームワークは以下のような種類があります。 Django (ジャンゴ) Python の Web アプリケーションのフレームワークの中では、最も人気の高いものの１つです。中規模以上のWebアプリケーションの構築によく使用されます。多くの機能が実装されており「フルスタックフレームワーク」と表現されています。 Flask (フ
UIデザインの作成ツール！誰でも分かるSketchの使い方【初心者向け】
UIデザインの作成ツール！誰でも分かるSketchの使い方【初心者向け】 初心者向けにSketchの使い方についての解説記事。アプリのUIデザインやWebデザインの作成ツールとして有名なSketchですが、初めて使う方でも分かるように細かく説明しています。デザイナーとしてスキルアップできるはずです。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 アプリのUIデザインなどを作る上で有名なツール「Sketch」 デザイナーの方でSketchを
Photoshopでテクスチャを使う3つの方法【初心者向け】現役デザイナーが解説
Photoshopの【テクスチャ】の使い方を初心者向けに紹介する記事。「パターンの定義」「レイヤーマスクの使用」「フィルターギャラリーを使用」の3つの方法を紹介。テクスチャを使うことで紙や布、岩などの質感を表現することが可能。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 テクスチャとは画像の一部、または全体に特殊な効果を入れることによって紙や布、岩などの質感を表現するものです。 Photoshopではさまざまな方法を使ってテクスチャ効果
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
