🔰はじめての方へ

プログラム

CSS

CSSの基礎文法学習!

CSSの基礎文法CSSは、セレクタ・プロパティ・値の3つからなります。書き方のポイントプロパティと値は、「{}」で囲みます。プロパティと値の間は「:(コロン)」複数プロパティを指定するときは、終わりに「;(セミコロン)」を忘れずに!コメント...
JavaScript

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

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

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

リファクタリングが難しいため、とりあえずここまで記載します。実際に作ったサイトはこちら(どんどん改良しているはず・・・)この問題のベースはBootstrapで組んでいます。HTML<div id="js-question" class="a...
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 クラスの使い方一覧【コピペOK】

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

Bootstrapのw-25〜w-100・h-25〜h-100の使い方まとめ【中央揃えも】

幅(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になってお...
JavaScript

【JavaScript】基本的な「変数・定数」を超簡単に紹介

JavaScript最近始めたものなので、自分で理解したことを紹介していきます。これを覚えるのにも苦労、活用するにも苦労しました。なんせ、わたくし今まで医療職をしていたもので、Webの知識が全くない!初めて 変数 といものをきいたとき全然理...
JavaScript

【JavaScript】エラーの意味を紹介

私はパソコン初心者で、JavaScriptを学習し始めましたが、エラーだらけです。しかも英語も読めないので、なんのエラーなのかわからないことが起きています。自分のためにも、一緒に困っている人のためにも、エラーの意味を紹介していきたいと思いま...
JavaScript

【JavaScript】BMIの計算!コード紹介!(簡単すぎる説明)

JavaScriptでBMIの計算をしてみるHTML<p>身長<input type="number" id="shincho">cm</p> <p>体重<input type="number" id="taijuu">kg</p> <p>...