てがろぐ - Fumy Otegaru Memo Logger -

お手軽一言掲示板(この辺の文章は「管理画面」の「設定」内にある「フリースペース」タブから編集できます。)

動作サンプルです。 ご自由にお試し下さい。パスワードguest管理画面もお試し頂けます。
■いま見ているスキンは「シンプル日記スキン」です。他に、 標準スキン昔のツイッターっぽいスキン(ブルー)昔のツイッターっぽいスキン(ピンク)付箋型スキンジャーナル(日誌)スキンブログタイプスキン(タイトル付きブログっぽくできるスキン)、 黒板スキンチャットタイプスキンがあります。
てがろぐCGIの配布・解説ページに戻る
:シンプル日記スキン: スキンは弄り放題なので、掲載したくない要素はたいてい省けます。このスキンでは投稿者名を一切表示しません。

or 管理画面へ

No.5243

New! 回答/返信 No.5243

昼食はそうめん。

🥪Re:5242◆リンクを画像に変えたいだけなら、CSSで実現できます。
例えば、外側スキンに <div class="backlink">[[FREE:HOMELINK]]</div> のように書いているとします。
すると、実際には <div class="backlink"><a href="設定されたリンク先">設定されたラベル</a></div> というHTMLが出力されますね。
このリンクテキストを例えば back.png という画像に置き換えるには、以下のようなCSSを使えば可能です。

.backlink a {
  display: inline-block;
  width: 100px;                     /* 画像の幅に合わせて調整 */
  height: 30px;                     /* 画像の高さに合わせて調整 */
  background-image: url('back.png');/* 見せたい画像 */
  background-size: contain;      
  background-repeat: no-repeat;
  text-indent: -9999px;
  overflow: hidden;
}

この方法なら、HTMLは何も変えずに、CSSだけでテキストリンクを画像リンクに変更できます。
(他には、JavaScriptで innerText をimg要素に置き換える手もありますけども。)

■フリースペース:

ここは、CGIの設定画面から自由に文章を入力して掲載できるスペースです。スキンを編集しなくてもCGI上から手軽に内容を変更できます(HTML使用可)。
動作サンプルです。◆他のスキン:標準スキン, 昔のツイッターっぽいスキン(ピンク版), 付箋型スキン, シンプル日記スキン, ジャーナル(日誌)スキン, ブログタイプスキン, チャットタイプスキン, 黒板スキンてがろぐCGIの配布ページに戻る

編集

■ハッシュタグ:

■日付一覧:

■日付検索:

■カレンダー:

2025年6月
1234567
891011121314
15161718192021
22232425262728
2930

■カテゴリ:

■最近の投稿:

■新着画像リスト:

Perlのバージョンを上げる設定(さくらインターネット)

全317個 (総容量 36.08MB)

■詳細全文検索:

  • 投稿者名:
  • 投稿年月:
  • #タグ:
  • カテゴリ:
  • 出力順序: