プログラムメモ
Category
WEB制作（html, css)
TypeScript
PHPプログラムメモ
PHPフレームワークLaravel
Stripe / Laravel Cashier
PHPフレームワークCodeIgniter
JavaScript
jQuery
node.js
WEB制作（html, css)
cssスタイルシート
Tailwind CSS
Bootstrap
サーバ構築・管理
Mac / Linux / FreeBSD シェルコマンドメモ
KUSANAGI
Pleskサーバ管理
Amazon AWS クラウド / EC2 , S3, Route53
Mac OSX おすすめフリーソフト
Karabiner-Elements
Auto Hot Key
MySQL
SQL Server（MS-SQL）
React / Next.js
Vue.js
Ionic / Angular フロントエンド
postgreSQL
gulp(タスク自動化ツール)
デザイン関連（Photoshop・Illustrator）
Figma / Adobe XD / Sketch
Mac OSX用 VST AU RTAS プラグイン
フリー素材（写真、アイコン、フォント）
iPhone / iPad
WEBサービス
SQLite
エディタ・WEB開発環境 /VS Code / Sublime Text
Flash / ActionScript
PHP Zend Framework
Windows WEB開発（ASP.NET Core / C#）
Visual Studio for Mac (Xamarin.Mac)
WEBアクセシビリティ / Google Lighthouse / W3C Markup Validation
クラウド/VPS/レンタルサーバ/専用サーバ
リッチテキストエディタ / TinyMCE / Summer note
git
最近のメモ
Ionic で Firebase ( Cloud Firestore ) を使用する
MacでHeroku の buildpackを使用して Docker イメージを自動で作成しLaravelアプリを起動する
Heroku の buildpackを使用して Docker イメージを自動で作成する
LaravelでDBのトランザクションを使用する
laravel-ide-helper を使用する
LaravelでCSVファイルをインポートする
Laravel Sail で開発環境を整える for Mac + VS Code
Recoil
Next.js で 画面遷移、1つ前の履歴に戻る
React hooksの概要 / useState / useEffect / useContext / useReducer / useMemo / useCallback / useRef
typescriptでコールバック関数の型
firebase emulatorを使用する （例: Authentication）
Laravelで別のコントローラーのメソッドを実行する
LaravelでFirebaseのjwt（accessToken）を認証する
JWTまとめとnode.js で JWTを検証(verify)する auth0 / node-jsonwebtoken
react や nextjs アプリを vscode .devcontainer（Docker） に対応にする
Laravel の イベント/リスナー を同時、または個別に作成する
Laravel で データベース更新時にフックをかけて自動的に処理を行う。
Laravel 5 6 7 8 で admin / user のMulti-Auth を素早く作成する
electron アプリ で hello World !
nuxt3 + typescript + vuetify
javascript の Generator の使いどころ?
nuxt2 + typescript + vuetify
vue.js の ミニマルな形
vue.js 3 + TypeScript 環境を作成する
検索
WEB制作（html, css)
トップに戻る
新規投稿
tags
フォント
[1]
html5
[5]
携帯スマホサイト
[4]
iPhone
[3]
フォーム
[1]
css
[17]
高速化
[3]
jQuery
[2]
Bootstrap
[6]
scss
[2]
compass
[1]
iPad
[1]
アニメーション
[1]
アイコン
[2]
illustrator
[1]
.htaccess
[5]
Firefox
[3]
検索エンジン
[3]
透過png
[1]
携帯
[2]
IE
[1]
WEB制作（html・css(スタイルシート))に関する各種メモ書き
クイックリンク
Mac でフォルダ内の png , jpg 画像を一括して ../webp/ フォルダに webpフォーマット変換する
WordPressを別サーバに移行する
W3C Valid な htmlページ コーディングの雛形
WordPressの管理画面に独自の画面を追加する
WordPress 管理画面の必須プラグイン
画像ファイルを png を圧縮する
WEBページやWEBシステムで Windowsの外字ファイル（ .tte ）を使用する
https と http の混在（mixed contents）をGoogle Chromeで見つける方法
Google Chrome Developers Tool のショートカット
HTML5の画像のsourceタグのsrcset で「ブラウザ幅」と「ディスプレイ解像度」によって画像を入れ替える
チェクボックスのCSSでのデザイン
テキストとアイコン画像の位置を揃えるCSS
TABLEタグをDIVタグとCSSで表現する
cssで position : absolute な要素を中央に配置する（上下左右センタリング）
HTML , CSS コーディング時に使用したい Sketch プラグイン
cssでfloatを使った時に高さを確保する
テーブル TR TD の hover をある箇所だけオフにする
RESTステータスコード
プリント時に要素を削除する CSS
電話番号に自動でつくリンクを消す
昔の古い Windows IE でのブラウザチェックを行う
WEBサイトのリンク切れを検知するリンクチェックツール
CSSでカーニング調整をして先頭が 「 （カッコ）の左端を揃える
IE6 〜 IE11 の表示チェックが行える IE Net Renderer
robots.txt を設置して検索エンジンクローラーが巡回しないようにする
iPhoneでフォーム入力時に 数字だけのキーボードを表示させる
flexboxによる上下、左右センタリング（中央寄せ）
Google Chromeでローカルにあるcssファイルを直接編集し保存する
JavaScriptでWEBページの印刷ボタンを作る
html 内のテキストにカーニングを適用する jQuery.Kerning.js
Bootstrapによるモーダルウィンドウ
dt,ddタグとCSSによるテーブル表現
emmet LiveStyle を使って SCSS の変更を即座にブラウザに反映させる
compass（SCSS）でretina,ロールオーバー対応のcssスプライトを自動生成するmixin
オンラインでRetina画像対応CSSスプライトを作成する
Google PageSpeed Insights の速度アップ修正に対応する
<img>タグで埋め込んだSVGファイルの色変更をする JavaScript
iPhone, iPadなどのWEB画面表示を確認する
CSSによるDIV（ブロック）要素の横並び方法4種類
スマホサイト制作時に設定しておくと良いhtml, css, JavaScript 項目
スマホサイトをフルスクリーンにしてWEBアプリぽく見せる
Bootstrapで画面サイズによって要素を【表示・非表示】させる
BootstrapのCDN
CSS3の実用的なアニメーション
CSS3で作るツールチップ（吹き出し）
Font AwesomeのWEBフォントをフォームのボタンに使用する
SSL（https://）サイト制作時の https , http 混在エラーをチェックする
iPhoneのsafariでフォーム入力の時に自動的に画面拡大するのを防ぐ
作成したWEBページの表示速度がどれくらい早いかをチェックする
illustratorやWEBサイトにCSS（WEBフォント）アイコンFont Awesomeを使う
hn.kd.ny.adslや中国からの検索エンジンロボット（クローラー）を制限する
画像やCSS,JavaScriptにブラウザキャッシュを適用させる
.html ファイルのデフォルト文字コードを出力する
Firefoxおすすめ拡張機能（アドオン）
リンクを選択した時のフォーカス枠を消す
サイト内検索ASPの代わりにGoogle AJAX Search API を使用する。
HTMLタグの閉じ忘れを自動修正してくれるWEBサービス
WEBサーバーのダウンを監視する無料のサービス
Windows IE にCSS3の角丸（radius）を適用させる
ツイッターに投稿してもらいやすくするTweetボタンを設置する
＜head＞内に rel=”canonical”属性 を指定してサイト内の重複コンテンツを防ぐ
複数の画像を1枚にくっつけて保存し、サイト表示を高速化させる（CSS Sprite）
HTML5ビデオを埋め込む。またiPhone, iPadで自動再生…。
HTML5の動画Playerライブラリ
HTML5での追加タグと記述サンプル
iPhoneのWebclip用アイコンを作成する
色情報取得ツール
「Windows IE6, 7, 8で透過pngを使う」の決定版
digest認証をつける
携帯サイト開発時に利用する携帯シミュレータ
親ディレクトリ（上位階層）で指定した Basic認証を特定ディレクトリで解除する
ブラウザのキャッシュを無効にする。また検索エンジンロボットにページ巡回、ページキャッシュさせないようにする。
htmlページにキーボードショートカットをつけるには。
Markdown記法のまとめ
swfobjectでFlashムービー（.swfファイル）を貼り付ける
携帯サイトでフォームの入力文字を固定する。
CSSチェックしエラー訂正するサイト【cleancss.com】
Windows版IEで画像をブロック要素にしてマージンをセットするとずれる
DIVの中を下揃えで配置する
ブラウザによるフォント表示の違い
リンクタグ作成Bookmarklet
css レイアウトで画像ボタンのメニューを作成する方法（css sprite）
無料で使えるオンライン上のSEOツール
RSS書式のひな型
RSS2.0の仕様
インジケーターアイコン
xhtmlでインラインフレーム（iframe）を使うと横スクロールバーが表示されてしまう不具合への対応
構造のマークアップなしでフロートをクリアする方法「clearfix」
アイコンファイル favicon.ico を作成する
<ul><li>を画像リンクにしたときに Firefox で画像の外まで点線が表示されてしまう
Windows IE を判別してJavaScriptやCSSを適用する
複数のCSSスタイルを指定するには?
ブラウザごとの差異をリセットするCSSデフォルト（reset.css）の設定
ブラウザによるフォント表示の違い
ブラウザによるフォント表示の違いをテスト。
フォント表示テスト用html
関連エントリー
Mac OSX10.4(Tiger) にImageMagick をインストールする
ホームページから不要なhtmlタグを綺麗に除去する HTML::Scrubber
添付ファイル1
fontpreview.html
( 11.3 KBytes )
ダウンロード
No.405
03/17 15:52
edit
edit
delete
添付ファイル