リンク先の文字下のアンダーバー非表示させたい

[新着] Webテンプレートを仮オープンしました



0   名前: CHOBI : 2006/11/05(日) 19:59  ID:xhq9npLR
リンク先の文字のアンダーバーを非表示させたいのですがうまくいきません。
使用しているMovable Type 3.33で作業を行っています。

試した方法ではメインページのテンプレートの<head>間に
<link rel="stylesheet" href="a:link{text-decoration: none;}" type="text/css" />を追加しやってみたのですが成功しませんでした。
ほかにもhttp://q.hatena.ne.jp/1034724971で紹介してある方法で試しました同じ結果でした。
設定の入れる場所など問題があるのかと思われますので下記のような感じで残します。


スタイルシートでの設定でこのリンク先の文字下のアンダーバーの非表示方法を教えてください。

<head>

<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
<meta name="generator" content="<$MTProductName version="1"$>" />

<link rel="stylesheet" href="<$MTBlogURL$>styles-site.css" type="text/css" />
<link rel="stylesheet" href="a:link{text-decoration: none;}" type="text/css" />
<title><$MTBlogName encode_html="1"$></title>

<link rel="EditURI" type="application/rsd+xml" title="RSD" href="<$MTBlogURL$>rsd.xml" />

<MTBlogIfCCLicense>
<$MTCCLicenseRDF$>
</MTBlogIfCCLicense>


</head>

質問に物足りない箇所がございましたら申し訳ございません。

1   名前: 匿名 : 2006/11/05(日) 19:59  ID:vF/mN4Au
> <link rel="stylesheet" href="a:link{text-decoration: none;}" type="text/css" />

興味深い書き方だ。まあ、確かにIE以外のFirefox、Opera(確かSafariも)なら

<link rel="stylesheet" href="data:text/css,a:link{text-decoration:none;}" type="text/css" />


とdataスキームを使えるけどね。
画像もテキストデータとして埋め込めるので、一つのHTMLファイルに全部埋め込んでしまえば、配布も楽になる。
興味があればやってみるといい。

閑話休題。
このサイトの「スタイルシートの基本」―「外部ファイルにまとめて設定する」に一通り目を通すべし。
分からない箇所や用語があればまたどうぞ。

2   名前: suzunone : 2006/11/05(日) 19:59  ID:rTI.mjdn
MovebleTypeで「リンクの下線を消したい」とのことですが、次の記述を次の方法で行ってください。

(上記の記述方法は根本的な間違いですので、削除するほうがいいと思います)


1 MovebleTypeにログインする。
2 ブログを選択する。
3 環境設定→テンプレートを選択する。
4 現在地が「インデックステンプレート」であることを確認後、「スタイルシート」をクリック。
5 テンプレートの内容の一番最後までいって、改行後次の記述をしてください。

a:link { text-decoration: none; } 
a:visited { text-decoration: none; } 
a:hover { text-decoration: none; } 
a:active { text-decoration: none; } 


意味としては、上から順番に、通常のリンク・アクセス済みのリンク・ポイント時のリンク・アクティブ時のリンク になります。それぞれの色なども変更できますので、ここで同時に設定するといいでしょう。

6 上記記載が終わったら、保存をクリック。
7 左側のユーティリティー→サイトの再構築で「すべて再構築」を選択。
8 再構築が終わったらサイトを確認してみてください。

下線が消えているはずです。


注意点:どこかのテンプレートを利用の場合、すでにcssで設定している場合があります。その際はスタイルシートの「a」の部分を探して記述を追加してください。

MovableTypeは手軽に利用できる反面、初めての人は勉強しないと使いこなせない部分もあります。

一度教本などをご覧になるのがよろしいかと思います。

3   名前: CHOBI : 2006/11/05(日) 19:59  ID:xhq9npLR
suzunone 様
わかりやすいアドバイスを頂ありがとうおございます。
正常に結果として表れました。
スタイルシートの方に入れたところで解決しました。
初歩的な質問で申し訳ございませんでした。

一覧へ戻る