design Edge

  • About
  • Contact

RSS

画像をBase64でHTMLファイルに直接埋め込む方法

画像をBase64にエンコード(変換)して直接HTMLファイルに埋め込む方法をメモしておきます。 ※この記事は過去の記事を最新情報に加筆修正したものです。 Webサイトの高速化技術のひとつとして、HTTPリクエスト数を減らす目的で用いられることもあるインライ ...

簡単!Facebookページプラグインをレスポンシブ対応する方法

Facebookをサイトに埋め込むための「ページプラグイン」をレスポンシブ対応(横幅可変)する方法のまとめです。 Facebookのページプラグインを埋込むこと自体はとても簡単ですが、埋込みコードそのままでサイトをレスポンシブにすると横幅が収まらなかったり狭すぎた ...

SourceTreeで既存プロジェクトに参加する方法<初級>

GUIで使えるGitクライアント「SourceTree」に新規リポジトリを追加する方法です。ちょっと今更感もありますが、毎回のように忘れてしまうので自分用にメモ。 リモートリポジトリはNAS(ネットワークHDD)等々に既に準備されているものとして説明します ...

CSSのappearanceを使ったセレクトボックスのカスタマイズ

セレクトボックス(select要素)のデザインを、CSSのappearanceを使ってカスタマイズする方法のまとめです。 つい先日、セレクトボックスをカスタマイズする機会があり、調べてみましたのでメモ代わりにまとめておきます。思いのほか、モダンブラウザでは見た目を ...

Facebookページへのいいね!ボタンを設置する方法と、管理権限委譲

「Facebookページ」へのいいね!(Like)ボタンを設置する方法、そしてFacebookアプリの権限委譲の方法まとめです。 Facebookのいいね!ボタンには、「Facebookページ」へのいいね!と「サイト」へのいいね!がありますが、「Facebookペ ...

Mac版Firefoxでbackground-size:coverでopacityをかけると右端に線が出る

background-size:cover; を適用した要素にオンマウス(hover)でopacityをかけると、Mac版Firefoxで右端に線が出てしまう現象の回避方法をメモ。 先日コーディングをしていて、ある要素にbackground-size:cover; ...

たった一行!Adsenseの背景黄色を透過する方法

Google Adsenseバナーの黄色い背景色が出ないよう透明にする方法をメモしておきます。 Google Adsenseのコードを取得してバナーを貼り付けると、広告バナーの背景色が黄色になってしまいます。背景が何色であれ、広告バナーが表示されてしまえば問題あり ...

オリジナル画像のFacebookシェアボタンを設置する方法

Facebookのシェアボタンをオリジナル画像にカスタマイズして設置する方法をメモ。 ツイートボタンをオリジナル画像にする場合などもそうでしたが、設置方法をすぐ忘れてしまい、毎回のように調べるところからやっているような気がします…。 そういう暮らしとはさよならし ...

WordPressでサムネイル画像つき人気記事一覧を出す方法

WordPressでサムネイル画像つきで人気記事を表示できるプラグイン、「WordPress Populer Posts」の表示設定のカスタマイズ方法をメモ。 WordPressで人気記事を表示する方法はいろいろありますが、プラグイン「WordPres ...

jQuery:ページ内リンクのスムーススクロール

jQueryでプラグインを使わずにページ内リンクのスクロールをスムースにする方法です。 ページ内リンクのスクロールを滑らか(スムース/スムーズ)にするためのjQueryプラグインを見かけることは多いですが、スクロールのためだけに結構なファイルサイズを読み込むのは気 ...
  • 1
  • 2
  • 次へ

人気の記事

  • CSSのappearanceを使ったセレクトボックスのカスタマイズ
  • 画像をBase64でHTMLファイルに直接埋め込む方法
  • Facebookで「このコンテンツは現在ご利用いただけません」とエラーになる場合の対処法
  • 簡単!Illustratorの埋込み画像を元サイズで抽出する方法
  • Windows10にしてネットにつながらなくなった時の対処法
  • 高品質!手書き風デザインの欧文フォントまとめ
  • Twitterのハッシュタグで使えない文字
  • CSS:オンマウス(hover)で画像をフェードする

新着記事

  • Adobe Creative Cloudを20%以上安く購入する方法!
  • 次に欲しい、デザイン性の高い名刺入れまとめ
  • デザイン性の高いおしゃれペンスタンドまとめ
  • GoogleカレンダーAPIキー取得とキーの制限方法
  • Googleマイビジネスの管理ユーザーを追加する方法(PC版)

タグ

CSS HTML Illustrator JavaScript Mac Photoshop SNS Web Windows WordPress まとめ アプリ コーディング デザイン バグ フォント プロダクト 素材

おすすめ書籍

シンカーデザイン|sincar design

design Edgeは、関西を拠点に活動しているデザイン事務所 sincar designが運営しています。デザインツールの Tipsや HTML / CSS / JavaScriptに関するメモ、デザインの過程で思ったことなどを書き留めています。

  • このエントリーをはてなブックマークに追加
このページの先頭へ

デザインエッジ|design Edge

Copyright© sincar design All rights reserved.