TORRANCE WEB DESIGNのエントリーから、画像に枠線やウォーターマーク、キャプションをつけるスタイルシートを紹介します。
[CSS]画像に枠線やウォーターマーク、キャプションをつけるスタイルシート
TORRANCE WEB DESIGNのエントリーから、画像に枠線やウォーターマーク、キャプションをつけるスタイルシートを紹介します。
CSS とブロック要素の配置について
はじめに XHTML 文書のレイアウトではしばしば，左側にメニュー一覧，右側に本文を書くようなスタイルもあります（２段組と呼ばれることがありますが，２段組とは正しくは新聞記事のように段落を２段に分けることです）．このようなレイアウトを実現するには，HTML の古いバージョンではフレーム機能を使ったりテーブルを利用したりしていました． しかし，文書管理，データベース化をはじめ携帯端末などを考慮すると，フレーム機能に依存しない文書の作成が求められます．また，テーブルを使ったレイアウトもテーブル本来の使い方をしていないので，文書管理としての不都合も生じます．それゆえ，こうしたレイアウトの実現も CSS に委ねるわけですが，これが意外と簡単ではありません．環境によっては全く意図しないレイアウトになったりもします．さらには，CSS をどのように定義したら所望の配置が得られるかを紹介しているページすら
【レビュー】HTMLのidとclassでいい名前をつけるテクニック | エンタープライズ | マイコミジャーナル
SitePoint: New Articles, Fresh Thinking for Web Developers and Designers HTMLを書く際に悩むことは多々あるが、中でも悩ましいことのひとつにidやclassで指定する「名前」がある。idやclass属性はCSSやJavaScriptで対象となる要素を特定するために使われる。わかりやすく一貫性がある名前をつけることは、WebプログラマやWebデザイナにとって欠かすことができないスキルであり、悩ましいところでもある。 How To Compose HTML ID and Class Names like a RockstarにおいてMeitar Moscovitz氏がidやclassの名前をつけるひとつの方法を紹介している。短くまとまっており参考になる。同記事では次のテクニックが紹介されている。まず、名前を考える段階で次
DOMAIN ERROR
ドメインウェブの設定が見つかりません 考えられる原因 ドメインウェブの設定がまだ行われていない。 ドメインウェブの設定がまだ反映されていない。(反映には数時間～24時間かかることがあります) ドメインウェブ・DNSの設定が誤っている。 アカウントが存在しない、契約が終了している、削除されている。
CSSをお手軽にデバッグする方法 | Happy My Life
何重にも依存して定義されているCSSをを簡単にデバッグする方法。以下の内容をCSS内に追加しておくとよい。 コードを見ての通り該当する個所が色付きで輪郭線が表示されるので、どういった構造になっているか一目瞭然。不要になったらコメントアウトするとよい。 * { outline: 2px dotted red } * * { outline: 2px dotted green } * * * { outline: 2px dotted orange } * * * * { outline: 2px dotted blue } * * * * * { outline: 1px solid red } * * * * * * { outline: 1px solid green } * * * * * * * { outline: 1px solid orange } * * * * * * *
HugeDomains.com
Captcha security check uka-p.com is for sale Please prove you're not a robot View Price Processing
カラーコード HTML・CSS用
Webデザイン用のプチツール 選択したデザインパターン上でブロックの色を変えことができます。選択したブロックのカラーコードも表示されます。 配色保存用アドレス機能 あなたの作った配色をブログやメールで紹介することができます。パレット右上の「保存用URL表示」をクリックするとURLが表示されますのでコピペしてご利用ください。 配色のヒント 雑誌や生活雑貨を参考にする 本文が読みにくい配色はさける。 同系統の色でまとめてみる。 同じぐらいの彩度でまとめてみる。 WEBデザインのヒント 重要なナビゲーションは、探せばすぐに見つかるように配置する 色、文字の大きさ、ブロック周りの余白を調整すると、目立つようになる ページを開いて、まずどこに目がいくのかを意識する 関連のある情報を固める 関連性の薄い情報ブロックの間には余白を入れる
CSSデザインテンプレート
商用・非商用を問わず、サイトの立ち上げ・リニューアルに使えるホームページ用テンプレートを配布しています。雛形ですので、修正しやすいシンプルなコードを心がけて作成しました。趣味のサイトに使うもよし、会社のホームページにするもよし、教材として使うもよしと、制限はゆるめです。制作代行でテンプレートを使ったり、そのまま再配布して金銭を得る行為は禁止です。 基本テンプレート セット 左サイド・右サイド・両サイドメニューを含む基本テンプレートセット。そのまま使ってもよし、CSSを修正してオリジナルデザインを目指すもよし。ホームページの雛形としてご利用ください。 左サイド 両サイド 右サイド まとめて３つをダウンロード トップページ ＋ 下層ページ サイトテンプレートセット WEB制作に使えるHTML+CSSテンプレートセットです。１０～３０ページの小規模サイト向け。商品やサービスに関連する写真と入れ替
CSS made easy « EZ CSS
What is CSS CSS is a programming language that is used in web development. It tells the browser how each HTML element on the website is supposed look. It used to style the text, images and everything else on the website. You can build a very nice looking and advanced website using nothing but CSS and HTML5. CSS is an abbreviation of Cascading Style Sheets. Which websites use CSS Almost all website
[CSS]スタイルシート設計のベースになる12のCSSのフレームワーク | コリス
specky boyのエントリーから、ブラウザのスタイルの初期化やレイアウトのテンプレートなど、スタイルシート設計のベースとなるCSSのフレームワークを紹介します。
960 Grid System — Demo
960 Grid System 12 Column Grid 940 60 860 140 780 220 700 300 620 380 540 460 460 60 60 60 60 60 60 60 60 60 60 60 60 60 380 220 220 220 220 60 380 16 Column Grid 940 40 880 100 820 160 760 220 700 280 640 340 580 400 520 460 460 40 40 40 40 40 40 40 40 40 40 40 40 40 40 40 40 40 400 220 220 220 220 40 400
Grid Designer 2
" + (m == 0 ? '' : "\n {column " + cn + "}\n ") + " \n\n\n\n\n'; this.exportform.css.value = css; this.exportform.template.value = html; this.exportform.margins.value = this.exp.join(', '); this.set_url(); }; this.getSample = function(n) { if (this.h_index[n] === undefined) this.h_index[n] = Math.floor( Math.random() * (this.h_samples.length-1) ); if (this.p_index[n] === undefined) this.p_index[n]
Drawter.com - DrawAble Markup Language
Drawter is a tool written in JavaScript and based on jQuery library. It provides you the possibility to literally draw your website's code. It runs on every single web-browser which makes it really useful and helpful. Each tag is presented as a layer you have drawn. Currently Drawter is available in Pro version, which means that it is intended for webmasters use only - knowledge of HTML and CSS is
Google、オープンソースのWebフォント集「Font Directory」と「Font API」を公開
Google、オープンソースのWebフォント集「Font Directory」と「Font API」を公開 Googleは、Webフォントを利用するためのフォント集とそれを利用するためのAPIを公開した。HTML5とCSS3の組み合わせでWebの表現力がさらにリッチになりそうだ。 米Googleは5月19日、フリーのWebフォントを集めた「Google Font Directory」と「Google Font API」を公開した。開発者は安全かつ容易にWebページでこれらのWebフォントを利用できるという。 Webフォントは任意のサーバ上にアップロードされているフォントをWebブラウザの表示フォントとして利用する技術で、これにより利用者のPC環境にインストールされていないフォントを表示用フォントとして使用できるようになる。CSS3ではWebフォントを利用するための「@font-face」機
初心者さんのためのWebサイト制作に役立つリンク集
2017年6月29日 Webサイト制作 「Webサイト勉強するのにおすすめのサイトを教えてください！」との声が多いのですが、日本のWeb関連チュートリアルサイトをあまり見たことがなかったので、今までおすすめできませんでした…。ということでちょっとググって初心者さんによさそうなサイトをいくつか紹介します。小難しい単語が並んであるようなサイトは避けているつもりですが、わかりにくかったらすみません。他にもおすすめサイトがあればぜひコメント欄にて教えてください！ ↑私が10年以上利用している会計ソフト！ Webサイトを作る流れ まずはWebサイトを作る目的を考える 誰のため？何のため？Webサイトを作り始める前に。 サイトマップと呼ばれる構成図を作成 Webサイトの構成図を簡単に作れる便利ツール ワイヤーフレーム（Webサイトのレイアウト）を作成 Webサイトの骨組み: ワイヤーフレームを素早く・
フォント名の指定は一般名と併用するべきです - Web標準普及プロジェクト
固有のフォント名だけを指定しないでください フォント名を指定する場合に(特にオーサリングソフトを使われている場合だと思われますが)、 次のようなフォント指定を行っているサイトがあるようです。 font-family: "任意のフォント名"; この「任意のフォント名に特殊なベンダー特有フォントを指定していることもありますし、 「ＭＳ ゴシック」を指定している場合もありますが、これらはあくまでも特定の環境に依存した指定です (ＭＳ ゴシックはWindowsには標準でインストールされているフォントですが、他のOSにはありません)。 WWWはサイト作者とは異なる環境の人も見ることになるわけですから、これは意図通りの表示が行われないことを意味します。 フォントの一般名も併記してください フォントはその種類ごとに一般名がCSSの仕様で定義されています。 フォント名を指定する場合は次のように一般名も併記
フォント表示サンプル
FONTS Revised 2003/12/10 CSS ではフォントの種類を指定できます。フォントとは、描画される文字のことで、文字の種類には、ゴシック体、明朝体などがあります。各々のフォントの種類には、太字や斜体などのバリエーションがあります。 CSS では、次の 5 つの総称名で分類されています。これらを、 generic family と呼びます。 sans-serif ゴシック体風。ひげ無し。 serif 明朝体風。ひげ付き。 monospace 等巾フォント。大文字、小文字、英数文字の巾が等しい。 fantasy 装飾体。花文字、ポップ文字など。読めないフォント（絵文字、シンボル・フォント）は除く。 cursive 手書き体風。 CSS でのフォントの指定方法 CSS の説明は別項に譲ります。 CSS でフォントを指定する場合、次のように記述します。 font-family:
<hr>要素のスタイル - CSS小技集
ここでは<hr>要素のスタイルを定める際に注意しなければならない事を具体例を交えて解説します。 まずはじめに…。 <hr>要素(横罫線)はCSSを扱う上で意外に厄介な代物です。 表示スタイルについて、明確な決まりが無いからです。 このため、<hr>要素に画像を用いる場合、さまざまな問題に悩まされました。 それでも、最近ではインターネットエクスプローラ 7.0 までを除けば、多くの環境でそれなりのスタイルを実現出来るようになって来たようです。 ただ、殆どのブラウザにバグがあるのも事実ですが…。 ここでは、なるべく多くの環境でそれなりに<hr>要素のスタイルを定める方法について考えてみましょう。 主なブラウザでの<hr>要素の実装。 ファイヤーフォックスとオペラでの<hr>要素の実装。 ファイヤーフォックスとオペラでは、<hr>要素の実装を以下のように考えているようです。 枠線は境界線と見なす
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)（「ICANNがレジストラとして認定した企業」一覧（InterNIC提供）内に「Japan」の記載があるもの）を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年5月時点の調査。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Seesaaブログカスタマイズ