alcusの日記 with GUINNESS

0001 | 01 | 02 |
2004 | 09 | 10 |
2005 | 01 | 02 | 03 | 04 | 05 | 06 | 08 | 10 |
<< 2017/03 >>
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31

2005-10-18

[]映画スタッフロールみたいに2カラムセンタリング

これは
映画スタッフロールみたいなのを作ってみたかったのです。
やってること
左側のdt要素は右そろえに、右側のdd要素は左そろえ(デフォルト)で設定してあります。こういう長い文章でも大丈夫みたいです。FireFox1.0.7とIE6で確認しました。
下線がひいてありますが
このテーマのdt要素の設定がそんな感じなので。特にキャンセルしてありませんです。
dl要素のcompactについて
段違いでなくしたかったので設定してみたのですが効いていないみたいです。まぁこれでもいいかなぁ、と思ってます。
dl {
	display: compact;
}
dl dt {
	position: relative;
	width: 30%;
	left: 20%;
	margin-right: 0.3em;
	text-align: right;
}
dl dd {
	position: relative;
	width: 30%;
	left: 50%;
	margin-left: 0.3em;
}

YuliYuli2012/08/14 03:41I came, I read this article, I conqueerd.

dvkouvejvsdvkouvejvs2012/08/14 22:46ANhSq5 <a href="http://ebxsxgzakphh.com/">ebxsxgzakphh</a>

ttlbfdjttlbfdj2012/08/15 03:22wrWSFk , [url=http://ayixlknnmjpc.com/]ayixlknnmjpc[/url], [link=http://pzdxjrokhxoi.com/]pzdxjrokhxoi[/link], http://gwlbrxxkgqjs.com/

khxrsuvscekhxrsuvsce2012/08/15 13:32fBJNz1 <a href="http://kamtzbqnhsng.com/">kamtzbqnhsng</a>

トラックバック - http://css.g.hatena.ne.jp/alcus/20051018

2005-08-08

[]ColorBlender.com

はてなブックマーク経由でこちらのページより。前回*1のColorMixerと同じくはてな青ヘッダで比べてみた*2のだけど結果はほぼ同じ。あんまし面白くない。まぁ「これと似た色でもうちょっと軽い感じで」とかいう調整につかえるかなぁ、というところかな。

http://colorblender.com/

BishworjitBishworjit2012/08/16 16:01You have more usuefl info than the British had colonies pre-WWII.

hjxogkpddhjxogkpdd2012/08/18 07:47mS2P2C <a href="http://ypzqkjtrasdb.com/">ypzqkjtrasdb</a>

pchhgmrwpchhgmrw2012/08/19 08:47D2RTEK <a href="http://tpmtourcxryi.com/">tpmtourcxryi</a>

トラックバック - http://css.g.hatena.ne.jp/alcus/20050808

2005-06-01

CSS3で新聞っぽくマルチラムできるかも?

slashdot経由*1で FireFox1.1候補の新機能を読む。といってもまだまだ機能は増減するはずなので1.1リリース時は別物になっている可能性は大きいのだけど、その中で

[CSS3]マルチラムレイアウト

マルチカラムレイアウト 草案の試験的な実装です。これにより、新聞紙面のような段組レイアウトを簡単に実現できるようになります。

Deer Park Alpha 1 - Web 開発者向け新機能

というわけでCSS3草案のマルチラムが目に見える形で実装されるわけで。同じくCSS3草案である縦書き*2も実装されれば前のエントリid:alcus:20050516#p1)で書いた「新聞っぽい縦書き」が実現できますね。

ただCSS3の前バージョンCSS2.1がそろそろ固まるか?といった状況なんでCSS3実現はまだまだ先になりそうです。

http://www.w3.org/TR/css3-multicol/

[]縦書きマニュアル

縦書きに関していろいろとまとめられています。やっぱりスクロールなんですよね。参考になりました。

http://www012.upp.so-net.ne.jp/tateruby/manual/index.html

トラックバック - http://css.g.hatena.ne.jp/alcus/20050601

2005-05-16

どんな風に縦書きされたいか

g:beta:id:alcus:20050513 からこちらへ。追記:比較的長い文章での縦書きサンプルの意味もあったので g:beta:id:alcus:20050517#p1コピーしました。

縦書き日記は誰でも一度はやってみたい形態の1つではあると思うけど実際やってみると見た目上の問題がいろいろでてくる。特にそれは長い文章のときに顕著なのでこうしてちょっと長々書いてみます。

比較的長い本文をもつ縦書き日記を表示する方法としては次の3つがあるかと思います。

  1. 横に長くする
  2. 縦に長くする
  3. 新聞っぽく段組する

横に長くする方法

縦方向サイズを設定することで横に長い日記がつくれます。一番収まりのいいのは日記全体を縦書きにする方法でしょうか。しかしはてなでは「横書きのヘッダーをどう落ち着かせるか」という問題があります。

また日記の一部(例えば日付ごと)を横にスクロールする形式で納めることも可能ですが本文部分が浮いた印象があります。

縦に長くする方法

横幅を指定する、CSS的には一番楽な実現方法ではないでしょうか。ただ読む際には目線にあわせて1行毎に縦スクロールさせる必要があります。

新聞っぽく段組する

これが実現できれば一番収まりがいいのではないでしょうか。ただ現状ではうまく実現する方法はないように思います。1つの手段としてサーバー側で「ブラウザにどう表示されるかをちゃんと考慮したHTMLを出力させる」という方法がありますが、閲覧者すべてのブラウザに対し「今縦幅はいくつか?横幅はいくつか?」と計算させるのは現実的ではないでしょう。

そのほか共通の問題

まず縦書きで表示できるブラウザIE系しかないこと。また縦書きが標準機能となっていないこと(今はたまたまIEが表示しているだけ)が問題です。縦書きに特化したCSSを組むと他のブラウザではまともに読めない状態になりやすいです。

またコメント欄を縦書きにした場合、コメント入力欄は横書きなので*1入力したときに違和感が感じられます。

*1CSSで回避可能かもしれません

トラックバック - http://css.g.hatena.ne.jp/alcus/20050516

2005-04-12

[]EasyRGB と ColorMixer

たださんの日記*1で知った ColorMixer 。普段使っている EasyRGB と似ているようで実はそんなに似ていないっぽい。

リンク先はそれぞれ、はてなダイアリーの青ヘッダをベースに計算させた結果。ColorMixerのほうが同系色の組み合わせをつくってくるのにたいし EasyRGB はアクセントになる色を作ってくる感じか?

YesicaYesica2012/10/28 13:54Lenairng a ton from these neat articles.

vazlmpdfuvazlmpdfu2012/10/29 04:46fv4d8e <a href="http://albzwzbjovsh.com/">albzwzbjovsh</a>

nanqhavqdhnanqhavqdh2012/10/29 15:303dGOdt <a href="http://bzsdgykznsga.com/">bzsdgykznsga</a>

rckgcfvyrckgcfvy2012/10/31 10:17m7zIVU , [url=http://qosbrvwjttts.com/]qosbrvwjttts[/url], [link=http://tefbkuawzkru.com/]tefbkuawzkru[/link], http://adcwwuwfpdzv.com/

JasonfusJasonfus2017/01/25 04:24книга на заказ http://wkrolik.com.ua/products/papki

トラックバック - http://css.g.hatena.ne.jp/alcus/20050412
<< 2017/03 >>
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
最近のコメント