2023年 | Page 13 of 13 | 自動化する会社　オートプロジェクト

Columnコラム

TOP
コラム一覧
年: 2023年の一覧

2023.01.12
WordPress

明奈

WordPressのプラグイン「Highlighting Code Block」を使用し、簡単にソースコードを表示させる方法

.column-content.content-wrap img {margin: inherit;} 今回は、WordPressのプラグイン「Highlighting Code Block」を使用し、簡単にソースコードを表示させる方法をご紹介します！ ①管理画面→プラグイン→新規追加→検索に「Highlighting Code Block」と入力。表示されたら「
READ MORE
2023.01.10
CSS jQuery

明奈

CSSで指定した!important をjQueryのcssTextプロパティを使い上書きする方法

!importantとは？指定するとどうなる［!important］は、CSSスタイルが適用される優先順位を最優先にする際に用いられます。何よりも優先してCSSの指示を効かせるやり方で、CSSスタイルがどうしても効かない場合に使うと、便利です。ただ、［!important］を使用しすぎると、どのスタイルが優先するか、ブラウザが混乱する為、乱用は避けましょう。 jQueryでの上書き
READ MORE
2023.01.07
WordPress

みわ

大容量コンテンツの強い味方「オブジェクトストレージ」とは？

画像を多く使用するWebサイトでは、サーバーのディスク容量が足りなくなる場合があります。特にWordPressでは、一つの画像を登録すると複数のサムネイル画像が生成される*ため、より容量を圧迫します。 *プラグインを利用していると、そのプラグインの設定によっては1枚の画像につき15種類もの画像が生成されることもあります。最近の画像データは1MBレベルのものも少なくないため、WordP
READ MORE
2023.01.06
CSS

明奈

flexでの余白指定はgapが使いやすい

gapとは gap は css のプロパティで、アイテム同士の横方向と縦方向の余白をまとめて指定する事ができます。 marginプロパティーやpaddingプロパティーでも余白は指定できますが、gridやflexboxでgapプロパティーを使うと柔軟にレイアウトを組めます。では、gapプロパティーを使用し縦10px、横20pxの余白を作ります。下記、HTML
READ MORE
CSS

明奈

CSSだけで補足情報を表示させる方法

ツールチップって何？ツールチップは、テキストやリンク、画像などの補足説明の事でマウスオーバーした際に表示されます。ALTに近いものになります。ツールチップの実装のためにCSSの関数attr()を利用することができます。以下、実装例になります。 See the Pen Untitled by 林 (@hayashi-akina) on CodePen.
READ MORE