MovableType スタイルシート攻略

**精子王** · 04/09/21 12:10:42

さぁ、語れ！

**Trackback(774)** · 04/12/17 14:38:24

>>66
ソースをまんまコピペした方がいいと思う。
たぶん単純ミス・・・

**Trackback(774)** · 04/12/17 15:18:02

流石ですね
”攻略”のヒントが満載ですね

**Trackback(774)** · 04/12/17 17:14:43

>>67
ありがとうございます。加えてみましたが同じでした。
>>68
まんまとなると、かなり長くなるんですけど、それでもいいのでしょうか？
抜粋するとこうです

div.entry-body blockquote {
border: 1px solid #fff;
border-width:2px;
MARGIN: 5px 5px 5px 20px;
PADDING: 5px 5px 5px 20px;
BORDER-STYLE:dashed;　
background-color: #333333;
font-size: 95%;
color: #fff;
}

div.entry-body blockquote blockquote {
font-size: 100%;
}

div.entry-body blockquote ul {
list-style-position: inside;
list-style-type: square;
}

div.entry-body pre {
font-size: 95%;
border: 1px solid #fff;
background-color: #E5E5E5;
color: #000;

**Trackback(774)** · 04/12/17 17:31:10

>>70
なんか中途半端な抜粋で判断のしようが・・・
アドレス晒せないの？

**Trackback(774)** · 04/12/17 17:37:28

>>70
div.entry-body blockquote ul, div.entry-body blockquote p { color: #fff; }

**Trackback(774)** · 04/12/17 17:39:44

>>70

それと元のスタイルシートにあれこれ追加するのはいいけど、無駄のないようにな。

div.entry-body blockquote {
border: 2px dashed #fff;
margin: 5px 5px 5px 20px;
padding: 5px 5px 5px 20px;
background-color: #333;
font-size: 95%;
}

**Trackback(774)** · 04/12/17 17:45:06

>>71
恥ずかしくてごめんなさい。

>>72-73
今から加えてみます！

新しいスタイルシートを発見したので楽しくなって探したスタイルをいろいろと
追加してしまっています。これから力量に合わせようと思います。

66 · 04/12/17 18:13:03

できた！

ありがとうございます。
今まで、追記や画像、リストの後の文字にはイチイチ<font color="#ffffff">を
使っていたので本当に助かりました。m( __ __ )m

**Trackback(774)** · 04/12/17 20:24:05

>>72-73
>>75
な、なんでこれで直るんだー！！

<body>
<div class="entry-body">
<blockquote>ここに引用文（黒背景に白字）</blockquote>
<p>ここに本文（白字にしたい）</p>
</div>
</body>

スタイルシートはbody { background-color:#000; color:#fff; }だよね、多分。

確かに提示されたスタイルシート自体にはおかしいところがあるけど、
entry-body p　に関しての記述ががないから影響がなく白文字で表示されると思うんだけど。

66 · 04/12/17 20:56:14

正直に書きます。。。
一度目はちゃんと表示されたので成功の書き込みをしたんですけど
もう一度更新したら、、、黒い文字のままでした。。。。orz
でもいまさらダメだったって書き込みにくくなっていました。

66 · 04/12/17 20:59:17

>>76
こうなっています

body {
font: normal normal normal 100%/1.5 verdana;
color:#fff;
background-color: #000;
}

**Trackback(774)** · 04/12/17 21:20:08

>>78
たぶんどっかでタグ閉じてないな。
ＨＰアドレス教えてくれたらすぐに分かるんだけど…

**Trackback(774)** · 04/12/17 23:47:17

>>79
なるほど
そうやって晒させるのですね。

**Trackback(774)** · 04/12/18 00:11:18

>>80
晒す以前にこの情報だけで回答できたらエスパーだぜよ
アップローダーでもどこでもいいからトップページとそのCSSを用意すれば
解決できるんだろうが

**Trackback(774)** · 04/12/18 00:17:04

適切に抜粋できる腕があったら最初からトラブってないと思われ

**Trackback(774)** · 04/12/18 02:08:18

>>79
俺もそれに５円。

**Trackback(774)** · 04/12/18 17:11:39

これのどこが「MovableType スタイルシート攻略」なんだろう
初心者板の方に誘導した方がいいんでねぇの

**Trackback(774)** · 04/12/18 18:06:37

そもそもMT特有のスタイルシート攻略法など存在しない

**Trackback(774)** · 04/12/19 10:56:58

そもそもgoo blog のほうが便利。

**Trackback(774)** · 04/12/19 11:17:37

簡単と便利は違う

**Trackback(774)** · 05/01/08 17:22:15

エントリー投稿時にリンク作るのがあるけど、あれ最初の状態から
target="_blank"　にしておくことって出来ないかなぁ・・・
そうするとかなり便利になるんだけどなぁ

**Trackback(774)** · 05/01/08 18:17:08

>>88
ブログ質問箱に解決策あり。があ、ＣＳＳとは関係ないべ。

**Trackback(774)** · 05/01/12 18:46:07

>>88
基本的に新規ウインドウで開かせたいならテンプレで
<base target=_blank>にしといて、同一ウインドウで開きたい
リンクのみその都度_selfにしとけばいいんじゃないのか。

**Trackback(774)** · 05/01/12 23:33:27

っていうか別窓で開くのやめようぜたのむウザイから

**Trackback(774)** · 05/01/13 01:52:02

>>91
「戻る」よりウィンドウ閉じる方が速いから微妙だけどな。
Operaなら戻るの速いんだけどなぁ・・・

**Trackback(774)** · 05/01/13 11:12:20

>>92
＞「戻る」よりウィンドウ閉じる方が速い

同感。マウスでいちいち「×」をクリックしてるならともかく
「Ctrl（Macではコマンド）+W」覚えてしまうとね…。

**Trackback(774)** · 05/01/14 16:22:43

タブブラウザ+マウスジェスチャーでやってるぶんにはどっちも大して変わらん。

**Trackback(774)** · 05/01/15 09:27:19

やたら重いサイトは戻るのにも時間かかるから
_blankの方がありがたいなぁ。
確かに>92の言うように戻るの速さはOperaを
見習って欲すぃ

**Trackback(774)** · 05/01/19 11:11:31

エントリータイトル部分の背景色を変えたいのですが、ブラウザによっては上手く反映されません。
テンプレートのスタイルシートを以下の様に書き換えました。
content h3の部分にbackground-colorを付け加えただけです。

■ 変更前
.content h3 {
color: #333;
font-family: 'Trebuchet MS', Verdana, sans-serif;
font-size: small text-align: left;
font-weight: bold;
margin-bottom: 10px;
}

■ 変更後
.content h3 {
color: #333;
font-family: 'Trebuchet MS', Verdana, sans-serif;
font-size: small text-align: left;
font-weight: bold;
margin-bottom: 10px;
background-color: DC143C　← 付け加えた箇所
}

MacOSXのSafariで見ると思った通りにタイトル部分の背景に色が付いたのですが、MacOSXのIEやFireFox、WindowsのIEで見ると何も変わっていません。
基本的な事で申し訳ありませんが、アドバイス頂けないでしょうか。
ご面倒お掛けしますがよろしくお願いします。

**Trackback(774)** · 05/01/19 11:18:12

すいません。解決しました。

background-color: DC143C
　↓
background-color: #DC143C

#を付けたらキチンと反映されました。
SAFARIをメインにしていたので気づかなかったのですが、SAFARIって#が無くても大丈夫だったのですね。
お騒がせしてすいませんでした。

**Trackback(774)** · NG

>>96
background-color: DC143C　← 付け加えた箇所
↓
background-color: #DC143C;　← 付け加えた箇所

05/01/19 14:32:33

レベル低いなｗ

**Trackback(774)** · 05/01/19 17:17:38

ｳ､ｳﾝ(´･ω･`)

**Trackback(774)** · 05/01/20 14:08:13

そ、そうだねコーウェンくん

**Trackback(774)** · 05/01/24 20:40:47

別スレで質問したのですが、スレ違いだった為にこちらに移動してきました。

スクロールバーの色を変更したいのですが、
スタイルシートに書き込んだところ、反映してくれません。
以下の記述です。
どのようにすれば良いのかご教授願います。

body {
  overflow-x: hidden;
  scrollbar-face-color: #FFFFFF;
  scrollbar-highlight-color: #000000;
  scrollbar-shadow-color: #000000;
  scrollbar-3dlight-color: #FFFFFF;
  scrollbar-arrow-color: #FFFFFF;
  scrollbar-track-color: #FFFFFF;
  scrollbar-darkshadow-color: #FFFFFF;
    margin: 0px 0px 20px 0px;
        background-color: #000000;
    }

**Trackback(774)** · 05/01/24 21:01:09

>>102
MT じゃなくて手書きの HTML でローカルで試したところ、ちゃんと反映したが。
まさか「 IE 以外で反映しません ! 」なんて言うんじゃないよね ?
つか、 overflow-x って……

**Trackback(774)** · 05/01/24 21:04:28

>>103
横は消したかったんです。
同じくＭＴ以外の動作を確認してます。
でもＭＴだとどういうわけか上手くいかなくて…。

**Trackback(774)** · 05/01/24 21:08:47

overflow-x ってそもそも IE 専用のプロパティだし、
hidden にするってことは、横スクロールバーが出るであろう場合に出ないようにしてしまうってことだ。
はっきり言って不便以外の何者でもない糞デザイン（設計という意味で）なので、
やめた方がいいと思う。

で、 MT で反映しないってことは、
単にスタイルシートのテンプレートの再構築ができてないとかそんなミスな気がしてきた。

**Trackback(774)** · 05/01/24 21:11:22

>>105
そうですか…。ではそこの部分、消しておきます。
再構築はちゃんとしました。
それでも反映してくれない(´Д⊂ｸﾞｽﾝ

**Trackback(774)** · 05/01/24 21:56:07

>>102
ドキュメントスイッチ消してみ
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
一番上のやつ

**Trackback(774)** · 05/01/24 22:45:22

>>107
消したら出来ました！
…が、デザインがぐちゃぐちゃに崩れちゃいますね。。。
うーん…。

**Trackback(774)** · 05/01/24 23:05:32

>>108
それはIE6の互換スイッチだから仕方ないべ。
どうしてもっていうなら、スイッチはそのままで、

htmlにもそのスタイルそのまま適用してみそ。

**Trackback(774)** · 05/01/24 23:15:51

>>109
駄目でした…。
根本的に不可能なのかなぁ。。。

**Trackback(774)** · 05/01/24 23:24:24

>>110
ttp://www.cybergarden.net/stylesheet/css_page_scrollbar.html

**Trackback(774)** · 05/01/24 23:41:43

>>111
サンクス！
お陰さまで出来ました。
レスして下さった方、ありがとうございます。

**Trackback(774)** · 05/01/25 12:01:20

先日MovableTypeスタイル＆コンテンツデザインガイドを買ったのですが…。
マルチカラムのWebサイト制作を考えているので早速情報集め。
しかし、ブラウザによって見栄えが変わるのを防ぐのって難しいですね…。
多分、ここがかなりの障害になっていると思います。
ここさえクリアすれば後は出来そうな気がします。分かりませんけど。
MTって、日本ではBlog以外で使ってる人って少ないですよね。
Blogも含め、Webサイト制作の為に、各ブラウザの対策をした枠だけのテンプレートってないでしょうか？
様々なタイプのマルチカラムの基本テンプレートがあればと思います。
それさえあれば、本を持ってるので後はなんとか自分で作れそうなんですが…。
スタイルシートとHTMLだけなので、MT以外でも使えそうです。
これがあれば、テンプレートを作る人が増えて面白そうです。
白テンって感じの呼び名で（仮）。

**Trackback(774)** · 05/01/25 13:04:06

>>113
日記は（ｒｙ

**Trackback(774)** · 05/01/27 07:00:01

日記の事忘れてました。
スタイルシートでマルチカラムの本も探したのですが、良さそうなのがありませんでした。
基本はＭＴも同じなので、「CSSでマルチカラム」のスレッドがあればとも思いました。
WEB制作管理板に「CSSでマルチカラム＆白テン計画」などと題して。
でも作る勇気ないなぁ…。
これから需要が増えてくると思うのですが、止めといた方が良いかな？

あと、レイアウト崩れを気にする前に自分で作ってみたんですけど、
全体的に真ん中に寄せても、サイドだけが横に行ってたりします…。
ヘッダー、サイド、メイン、フッターとやったのですが、
サイドとメインの長さが合わず、片方から背景の色が見えたりもします…。

**Trackback(774)** · 05/01/27 07:00:52

変なIDになってしまった…。

**Trackback(774)** · 05/02/04 15:06:30

日記が更新されてない(ノﾟДﾟ)ノ　＝＝＝＝　┻━━┻

**Trackback(774)** · 05/02/23 14:43:30

3カラムで質問ですが左右の幅を

#content {
margin-right : 185px ;
margin-left : 185px ;
}

といった感じで固定して、中央をAutoで利用しているのですが、
中央も300px以下の表示は許さないというようにしたいのですができますか？
つまりブラウザの表示幅が470px以下だったら下にスクロールバーを出すようにして、
それ以上の幅だったら中央のカラムだけ広がるようにしたいのですが
教えてもらえると助かります。宜しくお願いします。

**Trackback(774)** · 05/02/23 15:20:50

ＭＴだけのCSSなど存在しない。
クソスレ上げんな、ぼけ

**Trackback(774)** · 05/02/23 16:54:26

上げた程度でギスらせちゃうなんてかわいいなぁ。
仕方が無いからもう一度あげちゃいますね。

**Trackback(774)** · 05/02/23 18:05:48

>>118
適当にmin-width:300px;ではダメなのかと言ってみる。
適当だからツッコミ禁止。

**Trackback(774)** · 05/03/09 15:22:18

普通にXHTMLでｻｲﾄ作ってﾊﾟｰﾏﾘﾝｸにあたる部分をMTﾀｸﾞに置き換えればﾃﾝﾌﾟﾚ完成。CSSもｵﾘｼﾞﾅﾙをlinkさせるだけ。何を攻略するんだ?ｸｿｽﾚ終了～。

**Trackback(774)** · 2005/04/10(日) 10:51:06

>>43がとてもいいこといったのにあまり反応されてない気がする

**Trackback(774)** · 2005/05/03(火) 02:15:58

画像リンクの周りの枠線の色はどうやって変えたらいいのでしょうか？
枠線を消すとかはできるんですが・・・

**Trackback(774)** · 2005/05/03(火) 13:02:16

.content P IMG {
border-left : 1px solid #7F9DB9;
border-right : 1px solid #7F9DB9;
border-top : 1px solid #7F9DB9;
border-bottom : 1px solid #7F9DB9;
}

**Trackback(774)** · 2005/05/04(水) 21:16:21

上下左右同じにするのなら

border: 1px solid #000000;

でもOK

**Trackback(774)** · 2005/05/20(金) 03:57:00

上下にフレームを作ると横のスクロールバーが出てしまいます。

CSSをどのように変更したらいいのでしょうか？

**Trackback(774)** · 2005/05/20(金) 04:20:43

自己解決しました。

body {　　width:98%;

　　　　　　}

**Trackback(774)** · 2005/06/12(日) 16:14:39

このスレ立てた>>1ってすごくあたまわるそう

**Trackback(774)** · 2005/06/13(月) 04:02:42

3ｶﾗﾑなら ttp://filemaker.cx ここ参考にするべ

**Trackback(774)** · 2005/06/13(月) 12:39:33

>>130
どうでもいいんだが、そのページ

一番下までスクロールして
トップに行くためのアンカー等がないと萎えるな

**Trackback(774)** · 2005/06/14(火) 16:28:22

>>130

**Trackback(774)** · 2005/06/14(火) 16:30:29

>>130
結構イイと思た、XHTML VALIDだし。
IEの標準モードレンダリングで3カラムのレイアウトが崩れないのは珍しいんじゃない？

**Trackback(774)** · 2005/06/27(月) 19:38:57

movable typeにCSSファイルをアップロードすると、
日本語部分が文字化けしちゃうんだけど、
どうすればいいの？

**Trackback(774)** · 2005/06/27(月) 23:06:42

>>134
文字コードって知ってる僕？

**Trackback(774)** · 2005/06/28(火) 06:59:36

>>135
よく知らない

**134** · 2005/06/28(火) 08:07:28

もうちょっと詳しく書きます。

movable typeの文字コードがデフォルトのutf-8に設定中。
スタイルシートの先頭に@charset "UTF-8";
と書いてアップロード。

そうすると、スタイルシートの日本語部分だけ文字化けする；・・・

**Trackback(774)** · 2005/06/28(火) 11:04:22

そのスタイルシートは本当にUTF-8になってる？
宣言してる文字コードと実際の文字コードが違うんでない？

**Trackback(774)** · 2005/06/28(火) 19:11:51

cssをUTF-8で保存し直したか?

**Trackback(774)** · 2005/06/28(火) 22:14:12

>>134
（ ´,_ゝ｀）ﾌﾟｯ
アップロードするならUTF-8で保存後UP。
インデックスページで作ればよかたのにね。

**Trackback(774)** · 2005/07/31(日) 20:49:25

ここのサイトのカテゴリーのページとか、
エントリーの一番上に表示されてるのってどうやってるんでしょうか？
http://warcs.mond.jp/ms/

**Trackback(774)** · 2005/07/31(日) 22:06:37

>>141
phpなので外部ファイルをインクルードじゃないの。

**Trackback(774)** · 2005/08/04(木) 02:17:16

たまには、ほしゅ

**Trackback(774)** · 2005/08/20(土) 22:29:18

ageとくか

**Trackback(774)** · 2005/09/05(月) 04:16:38

>HINAGATAでは、ベーススタイルシートが2種類あります。一つは幅可変
>（ウィンドウ幅によって、ページの幅も変化します）。
>もう一つは幅固定です（ウィンドウのサイズに関わらず、サイトの幅を固定）。
>お好みに合わせてお選びください。

てことだすが、幅可変の一つしか見当たらないんすが。
幅固定はどこに？？

**145** · 2005/09/05(月) 05:47:28

今公開停止中だったのね。。。orz

**Trackback(774)** · 2005/09/07(水) 10:12:06

こんにちは
２台のPC（どちらもXPSP2、IE6画面解像度も同じ）で自分のblogを見ているのですが
片方ではちゃんと３カラムになっているのに　もう一方ではデザインが崩れて２カラムになってしまっています。
スタイルシートで全幅800、中央600　両サイド200で設定しているのですが…

考えられる原因があったら教えてください

**147** · 2005/09/07(水) 11:21:56

自己レスです
ノートンの2004と2005の違いでした。　オフにしたら直った。スマソ

**名無しさん＠そうだ選挙に行こう** · 2005/09/11(日) 12:16:59

それってノートンの何の機能によって、3カラム構造がおかしくなるんですか？

**Trackback(774)** · 2005/09/13(火) 15:38:18

>>141
それより、ここのサイト、
文字化け醜いゾ！
UTF-8なのに、なんで化けてるんだｗ
管理人、頭悪いのか？

**Trackback(774)** · 2005/09/13(火) 17:45:20

>>150

人のせいにしない

**Trackback(774)** · 2005/09/14(水) 04:05:53

MT弄るの初めてなんで質問させてください。
HINAGATA-PHOTO 0.7を使いたいのですが、MT3.1なので
サムネイルが表示されません。それでもなんとか表示できる方法が
HINAGATAさんとこに書いてましたが表示がおかしい。

ですのでHINAGATA-PHOTOを使うためにMT2.Xが欲しいのですが
どこかにないんでしょうか？

**Trackback(774)** · 2005/09/14(水) 13:40:03

>>152
3.1でも普通に使えるのでMTのせいにしないでください。

どーせこの意味が解らない馬鹿なんだろうけど。
Keywords :
Thumbnail HTML Code(Less than 75 px of width)

**どーせ意味が解らない馬鹿** · 2005/09/14(水) 15:11:07

>>153
すいません、仰せのとおりできましたorz
説明もよく読まず先にググってしまい、サムネイルのうｐ方法を
わからないまま古い情報で右往左往してしまいました。
ありがとう！

**Trackback(774)** · 2005/09/14(水) 18:18:20

馬鹿と言われて「ありがとう」とはよっぽどの馬鹿なのか、
よほどの人格者なのか・・・

**どーせ意味が解らない馬鹿** · 2005/09/14(水) 23:49:39

>>155
人間馬鹿になるとなんでもできますよ。
とは昔世話になった会社の社長の言葉で。まぁ今回の件とは意味が違うけど。
>>153が俺の事を馬鹿にしてるだけなら最後の２行はありませんからね。
呆れつつ助けてくれたと解釈してます。

**Trackback(774)** · 2005/09/15(木) 01:09:25

ぼく、ばかになってみましたあ。
あはははは。
もう、なんでもできるっす。

**Trackback(774)** · 2005/09/15(木) 03:27:26

HINAGATA-PHOTOの話で便乗させてください！
とりあえずデフォのままで運用してますが、表示画像のリンクカラーが
うざくて仕方ないです。文字のリンクカラーは変えられたのに
画像だけ、青とか紫とかになって目障りです。変え方教えてくれませんか？

**Trackback(774)** · 2005/09/15(木) 05:04:01

そんなことは簡単です。
馬鹿になればいいんです。
あはははは。

**Trackback(774)** · 2005/09/15(木) 08:14:47

>>158
a img {
border: none; text-decoration: none;
}

**Trackback(774)** · 2005/09/15(木) 20:59:00

>>160
ｱﾘｶﾞ㌧！見事にすっきりしました！

**Trackback(774)** · 2005/09/22(木) 13:58:20

この娘たちは本物だろうか？
エロすぎるんです…。
ttp://koiten.com/?n07

**Trackback(774)** · 2005/09/25(日) 21:22:24

初めてStyleCatcherをアップロードしましたが
「Select a Design using StyleCatcher」をクリックすると

エラーが発生しました：
Please configure the settings for this plugin before using it.

と表示されてしまいます。
stylecatcher.cgiで設定する箇所があるのでしょうか？

**Trackback(774)** · 2005/09/25(日) 21:24:41

>>163
path設定が間違っているから見直してみんさい。

そのメッセージの意味は
"それを使用する前に、このpluginのために設定を構成してください。"
ということです。

MovableType StyleCatcher Plugin, in plugin, on Movable Type 4989
http://movabletype.yh.land.to/archives/2005/09/12/movabletype-stylecatcher-greasemonkey-plugin/

**Trackback(774)** · 2005/09/25(日) 21:38:20

>>164
即レスありがとうございます
書かれてるとおりに最初からやり直したら成功しました

**yoshi** · 2005/10/01(土) 22:42:28

MTを利用して写真とタイトルが一緒になった画像とその下に
コンテンツメニューがあるブログをやってみたいと思うのですが
このようなデザインを作るのは、作業は大変でしょうか？

**Trackback(774)** · 2005/10/02(日) 22:11:59

そんなに大変じゃないけど、ブログである必要はないと思う。

**Trackback(774)** · 2005/10/16(日) 22:39:20

3.2が出たけど、スタイルシートなどのデザイン的にはどう変わったのかね？