ricopinxのブックマーク - はてなブックマーク

目玉焼き丸くするには？型を使って綺麗な丸型にする方法 [家族のお弁当レシピ] All About

目玉焼き丸くするには？型を使って綺麗な丸型にする方法目玉焼きを型で綺麗な丸型にする簡単な作り方・焼き方レシピをご紹介します。アルミホイルで丸い型を作れば簡単に綺麗な丸型の目玉焼きに。目玉焼きの形は丸くする以外にも、ハート形などにすることもできます。丸い形の綺麗な目玉焼きを楽しみましょう！

ricopinx 2017/02/06

https://allabout.co.jp/gm/gc/188286/

レシピ

リンク

指定量スクロールした時点で上端にメニューを出す方法 [ホームページ作成] All About

指定量スクロールした時点で上端にメニューを出す方法ウェブページをある程度スクロールした段階で、描画領域の上端にメニューなどの任意の「バー」を固定表示させる方法を解説。jQueryを使えば、「現在のスクロール位置」を取得してから「指定量以上スクロールされたかどうか」を判定して、ボックスの表示・非表示を切り替える……という処理も、とても簡単に実現できます。

ricopinx 2016/09/16

リンク

移転先へ自動移動(転送/リダイレクト)させる方法 [ホームページ作成] All About

ウェブ上でのリダイレクト(Redirect)とは、あるURLから別のURLに転送することです。アクセスされた瞬間に自動移動させることで、転送された事実に気付かれないくらい一瞬で移動させることもできますし、転送の予告を数秒間ほど案内した後に自動移動させることもできます。また、その移転が恒久的なのか一時的なのかを示すこともできます。この種別は、検索エンジンに対して「移転前のURLと移転先のURLのどちらを登録すれば良いのか？」を知らせる役にも立ちます。ウェブサイトを移転した場合など、指定したURLに自動的に転送させたいウェブサイト全体や、特定のページにアクセスしてきたユーザを、指定のURLに自動転送したい場合があります。例えば、以下のような場合です。ウェブサイトを引っ越して、URLが変更になった場合ウェブサイトの構造を改変して、一部のファイル名やディレクトリ名が変更になった場合 UR

ricopinx 2016/04/11

301リダイレクト

リンク

4/4 tableレイアウトをCSSだけでレスポンシブ化する方法 [ホームページ作成] All About

tableレイアウトをCSSだけでレスポンシブ化する方法(4ページ目)table要素で作られたテーブルレイアウトなウェブページを、CSSだけでレスポンシブ化する簡単な方法を解説。表のセルを作るtd要素に対してdisplayプロパティを使えば、HTMLソース上では表組みのまま、各セルを分離して再配置できます。画面サイズに応じて表の列数を2列や3列などに自動変化させる方法を、サンプルページと共にご紹介。

ricopinx 2015/12/16

リンク

PC版とスマートフォン版サイトを自動で切り替える方法 [ホームページ作成] All About

スマートフォンは、PC用に作られたウェブサイトでも表示できます。しかし画面サイズが小さいため、そのままの状態では読みにくい可能性があります。その場合の対策としては、レスポンシブWebデザインを採用するスマートフォン専用サイトを作るなどの方法があります。 ■更新や管理が楽なのはレスポンシブWebデザインだが…… 更新や管理の労力を考えれば、レスポンシブWebデザインを採用する方が楽でお勧めです。その方が、同じ情報を掲載したページを複数用意する必要がありませんし、新しい端末が登場しても(おそらくは)何もせずに対処可能ですから。 (参考) ブラウザの幅に合わせて表示を自動変更するレスポンシブ技12選しかし、既存のPC用サイトがレスポンシブ化しにくいデザインな場合や、スマートフォンの特性を活かしたウェブサイトを用意したい場合では、PC版サイトとスマートフォン版サイトを分離する方が望ましいこ

ricopinx 2015/09/10

PC版とスマートフォン版サイトを自動振り分けする方法

リンク

【HTML＋CSS】ウインドウ幅に合わせて画像サイズを変化させる方法 [ホームページ作成] All About

レスポンシブWebデザインとは、画面サイズなどの閲覧環境に応じてWebページのレイアウトや装飾が自動調整される作り方のことです。記事「レスポンシブWebデザインの簡単な作り方」でも解説しました。特に、画像サイズを画面幅に自動で合わせる方法は、Webサイトのスマートフォン対応目的でも需要が高いでしょう。例えば、下図のWebページをご覧下さい。ページ上部に見える大きなバナー画像の表示サイズは、ブラウザのウインドウサイズをある程度小さくすると、描画領域の横幅に合わせて自動的に縮小されるデザインになっています。今回はこのような、画面サイズ（ブラウザのウインドウの横幅サイズ）に合わせて、縦横比率を維持したまま画像の表示サイズを変化させる方法をご紹介いたします。レスポンシブWebデザインを採用したページではもちろん、そうでない場合でも、画面サイズに合わせて画像サイズを自動で拡大縮小させたい様々な場

ricopinx 2015/07/31

リンク

ノートのように罫線（下線）を引く

ノートのように罫線(下線)を引くデザインの作り方(2ページ目)ノートのように、文中の各行に下線を引くデザインの作り方を解説。罫線画像とスタイルシートを組み合わせると、簡単にノートのように見えるデザインが作れます。ノートの下線を画像で用意するまずは、ノートの下線になる画像を用意します。ここでは、下記の画像を用意しました。必要であればご自由にコピーしてご活用下さい。「」：bluedash.gif 「」：greendot.gif 「」：redbrush.gif 画像はすべて高さを25ピクセルにして作成しています。画像の最下部に下線が引いてあり、それ以外は透明色になっています。スタイルシートでデザインする際には、この「画像の高さ」に合わせて記述する必要があります。横幅は何ピクセルでも構いません。高さは25ピクセルである必要はないので、お好きな高さで作って下さい。ノートのように見える

ricopinx 2015/06/01

リンク

地図の素材をダウンロードできるおすすめサイト [Web素材] All About

地図の素材をダウンロードできるおすすめサイト国内外の白地図や地図記号、地図のイラスト、アイコンなどの素材をダウンロードできるサイト（有料・フリー）をご紹介します。なお、ご利用の場合は、必ず、それぞれの素材ごとに利用規約をご確認ください。地図の素材をダウンロードできるおすすめ無料・有料サイト国内外の白地図や地図記号などの素材をダウンロードできるサイトをご紹介します。なお、ご利用の場合は、必ずリンク先の素材サイト上で、それぞれの素材ごとに利用規約をご確認ください。また、このページに掲載している素材見本を、ダウンロードして使用することは禁止していますのでご注意ください。 Map of Japan 【無料】 Map of Japanは、Web上で日本及び都道府県の白地図を作ることができます。ボタンクリックだけで作成できますので、表示された地図画像を保存してご利用ください。

ricopinx 2013/02/20

地図制作

リンク

はてなブックマーク

タグ

ブックマーク / allabout.co.jp (8)

お知らせ

今週のはてなブックマーク数ランキング（2024年10月第1週）

月間はてなブックマーク数ランキング（2024年9月）

今週のはてなブックマーク数ランキング（2024年9月第5週）

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス