CSSのヒント（8）

テクニック1

場合によっては、子要素の幅が親要素の幅よりも大きくなることがあります。

この場合、ulの幅はプレートの中心の幅よりも大きく、レイアウトには影響しません。

テクニック2

ボードの中心近くに固定位置決め要素を作成するにはどうすればよいですか？

回答：固定ポジショニングを使用してください。左の値：50％マージン-左はボードの中心の半分にそれ自体の幅を加えたものに等しく、負の値に注意してください
ここに画像の説明を挿入

テクニック3

親要素の子要素を整列する方法（インラインおよびインラインブロック要素の場合）

回答：子要素がインラインブロック要素またはインライン要素であり、テキストtext-align：centerである必要があることを確認してください。

テクニック4

：フォーカス疑似クラスセレクターは、フォーカス要素を取得するために使用され、通常はフォーカス要素を参照します

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        input:focus {
            border: 1px solid red;
            background-color: red;
        }
    </style>
</head>

<body>
    <input type="text">
</body>

</html>

文字省略

1行のテキストの省略

	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;

複数行のテキスト省略方法


word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;