クロスブラウザーソリューションを使用してリスト項目タグの画像を設定する

分析例:

ul:

● リストスタイルタイプを削除なしに設定します。リスト項目タグ

#パディングとマージンを 0px に設定します (ブラウザ互換性)

##すべて ul:

## にあります## 画像の URL を設定し、一度だけ表示されるように設定します (重複なし)

#● 必要な画像の位置を設定します (左 0 ピクセル、上 5 ピクセル)下)

●padding-left 属性を使用してリストにテキストを配置します

次のセクション

新しいファイル

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<style>
ul
{
	list-style-type:none;
	padding:0px;
	margin:0px;
}
ul li
{
	background-image:url("https://img.php.cn/upload/article/000/000/015/5c6e720242040312.gif");
	background-repeat:no-repeat;
	background-position:0px 5px; 
	padding-left:14px;
}
</style>
</head>

<body>
<ul>
<li>PHP</li>
<li>JavaScript</li>
<li>MySQl</li>
</ul>
</body>
</html>

提出するリセットコード

自動運転

全画面表示

クロスブラウザー ソリューションを使用してリスト項目タグの画像を設定する

クロスブラウザーソリューションを使用してリスト項目タグの画像を設定する