🔰はじめての方へ

maple

JavaScript

【JavaScript】クイズ問題作ったけど、TagName(“button”)でbuttonタグすべてが作動してしまう

このように、問題の答えをクリックするボタンと、解説をクリックするボタンの2つが存在します。JavaScript のコードを 「document.getElementsByTagName("button")」にすると、ボタンタグ全てが配列に入...
JavaScript

【JavaScript】クイズ問題(簡単なの)

リファクタリングが難しいため、とりあえずここまで記載します。実際に作ったサイトはこちら(どんどん改良しているはず・・・)この問題のベースはBootstrapで組んでいます。HTML<div id="js-question" class="a...
はじめての方へ

独学!Web初心者の参考本ご紹介

※ここではアフィリエイト広告(Amazonアソシエイト含む)を掲載しています。こんにちは。看護師から何とか短期間でジョブチェンジするためにがんばって学習しています。私が参考にしている本を紹介します!自分だけでは何がいいのかわかりませんよね。...
Bootstrap

【Bootstrap】グリッドシステム

Bootstrapとはは、別の記事に簡単にまとめていますのでご参照ください。グリッドシステムとはサイトの横幅を均等に分けるラインをグリッドと呼び、Bootstrapは12本のグリッドが設定されています。こちらをもとに、コンテンツの配置を決め...
Bootstrap

Bootstrap5 チートシート早見表!素早く検索するためにまとめた

グリットシステム<div class="container text-center"> <div class="row"> <div class="col"> Column </div> <div class="col"> Column <...
Bootstrap

【Bootstrap5】実践!クイズ問題の形を作ってみた

今回はWeb初心者が、Bootstrapを用いてクイズ問題の型を作ったので、ご紹介したいと思います。Bootstrapについては、別の記事をご参照ください。完成図HTML<h3 class="text-center mt-2"> クイズ問題...
Bootstrap

【Bootstrap】フォントの大きさ変更

文字の大きさは「fs-1~6」で記載します。Sassマップの$font-sizesを変更することでカスタマイズすることができます。<p class="fs-1">.fs-1 text</p><p class="fs-2">.fs-2 tex...
Bootstrap

【Bootstrap】幅と高さと中央揃えの設定

幅(width)20%、50%、75%、100%、autoがあります。<div class="w-25 p-3" style="background-color: #eee;">Width 25%</div><div class="w-50...
Bootstrap

Bootstrapの簡単な説明

Bootstrapとはブートストラップとは、とても簡単に無料でCSSを使うことができるものです。スマホ、タブレットといった、パソコンとは画面の大きさが違うものに対応するページを作るレスポンシブデザインに対応しているフレームワーク1になってお...
パソコン

ウイルスに感染!?警告の嵐。偽警告に注意!

ある日、画像をみていて、とあるURLにアクセスしたところ、マカフィーの警告が次々とポップアップででてきて怖い思いをしました。偽の警告でした。怖い思いをしたので、同じような状況になったときに誰かの役に立てたらと思います。偽の警告が出るようにな...