Webサイト制作

投稿日:2017年4月17日 更新日:

サイトのタイトルを画像置換する方法

よくやり方忘れてしまうのでメモ。 サイトのタイトルをh1とかで記述した場合 それを画像置換するための方法は色々あって 評価が分かれるので現時点でいいなと思っているものを。 まずはhtml
<h1 class="sitename"><a href="http://~">サイト名</a></h1>
で、こちらがスタイルシート
.sitenameS a{
	display:block;
	width:320px;
	height:320px;
	background:url(http:画像のパス)no-repeat;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	}
widthとheightは置換画像のサイズに合わせて指定してください。

- Webサイト制作
-

関連記事

no image

サイト制作に役立つTips_リンク集

目次1 スタイルなどの装飾1.1 ボタンのホバーアニメ1.2 角丸とシャドウのジェネレーター1.3 グラデーションジェネレーター1.4 CSS三角形作成ツール1.5 吹き出し作成のジェネレーター1.6 ...

no image

cssで作るタイトルやテキストの装飾色々メモ

目次1 タイトルの背景を斜めボーダーにしたい2 タイトルの左右に画像を配置3 タテキストにグラデーションをかけたい タイトルの背景を斜めボーダーにしたい 斜めボーダー背景。 色の組み合わせで色々な雰囲 ...

amazon APIのBrowseNode ID一覧ってどうやって調べるの?

目次1 amazon APIのBrowseNodeID1.1 BrowseNodeって?1.2 まずは必要情報を入力2 本4656103 ドラッグストア 1616690114 ホーム&キッチン ...

jQueryで実装!画像の無限ループスライダー

よくサイトで見かけるイメージ画像がひたすら流れるやつをサイトに実装したいと思い調べたところ、下記のサイトに使いやすそうな無限ループスライダーがあったので実装。 jQueryで無限ループスライダー 目次 ...

IE10で要素がはみ出してしまう時の対処法

なぜかIEだけ特定の要素がはみ出てしまうことはありませんか?私はよくあります。 ページ作成をしていてブラウザチェックをしているとよくぶち当たるこの問題。 何度か解決してるけど、しばらくしたら忘れてしま ...