他言語サイト
翻訳はみつかりませんでした

Web

Webについて困っているという人のために情報を発信します。

HTMLとCSSだけで簡単に作る。軽量な閉じる・すべて表示ボタン

html5 css3 image

HTMLとCSSだけで『閉じる・すべて表示』ボタンを簡単に作る方法をご紹介します。このボタンは、画面を遷移しないでコンテンツを閉じたり追加表示します。JavaScriptは使いません。

これは、コンテンツを制御するときに、Webサーバーにリクエストを送信しないので、Webページのパフォーマンスを上げることができます。

続きを読む

WordPress5.0のメジャーアップデートの注意点と対応

wordpress image

ついに、Wordpress5.0がリリースされました。このバージョンからエディタが大きく変わります(名称Gutenberg)。

ただほとんどの人はすぐには使えないでしょう。あまりに劇的な変化のため使えない機能・プラグインが出てくるからです。

心配ありません。簡単な対応方法と、どういうデメリットがあるのか、いまから詳しく見ていきます。

続きを読む

かんたんCSS 言語別にスタイルを適用する(:lang疑似クラス)

css3 image

マルチ言語サイトで、同じスタイルをそれぞれ用意するのではなく、同じものを使いたいときがあります。でも、CSSに文字列を書いてある場合どうしたらいいのでしょうか?

CSSでは、サイトの言語別に分けてスタイルを適用させる方法があります。サンプルコードを使って、かんたんに誰でも分かるように解説します。

続きを読む
  • by Google Ads

JavaScript ES2015 var,let,const 変数宣言の使い方

JavaScript image

久しぶりにJavaScriptを使うことになって調べたら、変数宣言のバリエーションが増えていました。let, constという使い方があるらしい。

ES2015で策定されたのでもう2年も前です(執筆時点)。やばい相当遅れています。遅まきながら勉強しました。

続きを読む

黄金比を計算するツールを作りました。

gold

黄金比の計算ツールはたくさんありますが、Webデザインで欲しい計算結果が足りないと思っていたので自分で作っちゃいました。

使いみちは無いかもしれませんが、大和比・白銀比、白金比・第二黄金比・青銅比もついでに計算します。

続きを読む

  • by Google Ads

初心者でも分かる解説。JavaScriptってなんだ?

JavaScript image

JavaScriptの超入門編です。初心者にも分かりやすく、専門用語を使わずに解説します。

これを読めば、JavaScriptの役割、jQueryのこと、最近よく聞くReact, Vue.jsのことも分かります。

『いまさら見直すのは恥ずかしい』という人にもオススメです。

続きを読む

HTML5&CSS3: レスポンシブ対応の基本フォーマットを作成した

html5 css3 image

HTMLとCSSだけで作る、レスポンシブに対応したWebページの基本フォーマットを用意しました。

  • 1カラム
  • 2カラム(左メニュー、右メニュー)
  • 3カラム(両端メニュー)

の4パターンがあります。

cssクラスを1か所変えるだけでパターン変更ができて、スマホサイズになるとサイドメニューが下の方に表示されるようにしています。

続きを読む

HTML&CSS: 【新旧比較】レスポンシブ対応の基本フォーマットを作成した

html5 css3 image

HTMLとCSSだけでつくった、レスポンシブに対応したWebページの基本フォーマットを全面的にアップデートしました。

  • 1カラム
  • 2カラム(左メニュー、右メニュー)
  • 3カラム(両端メニュー)

の4パターンを用意しています。

cssクラスを1か所変えるだけでパターン変更ができて、スマホサイズになるとサイドメニューが下の方に表示されるようにしています。ここでは、新旧サンプルの比較を行います。

続きを読む

  • by Google Ads

HTMLとCSSだけで簡単に作る。軽量なタブで表示内容を切り替え

html5 css3 image

HTMLとCSSだけでタブのメニューを簡単に作る方法をご紹介します。このタブメニューは、画面を遷移しないで表示内容のコンテンツを切り替えます。JavaScriptは使いません。

これは、タブを切り替えるときに、Webサーバーにリクエストを送信しないので、Webページのパフォーマンスを上げることができます。

続きを読む

この記事を気に入ったらぜひシェアも!!