Web デザイン CSS スタイル コードの完全なコレクション、ぜひ集めてください。
不要なコードを大幅に削減し、HTML CSS で簡単に Web ページをレイアウトできます。友達、あなたのコレクションに保存してください~
# 1. テキスト設定
1,font-size: フォント サイズパラメータ
font-style: フォント形式
font-weight: フォントの太さ
color: パラメータ
2. ハイパーリンクの設定
text-decoration: 参数
- underline: テキストに下線を付けます
- 上線:テキストに下線を付けます
- line-through: テキストに取り消し線を引きます
- blink: テキストの点滅を使用します
- none: 上記の効果を表示しません
3. 背景
background-color: 参数
background-image: url(URL)
- URL は背景です ストレージ パス画像の「なし」は「なし」を意味します。
background-repeat: 参数
- no-repeat: タイル状の背景を繰り返しません。画像
- repeat-x: 画像タイルを水平方向のみに作成します
- repeat-y: 画像タイルを垂直方向のみに作成します方向 Paving
background-attachment: 参数
- fixed: Web ページのスクロールWeb ページがスクロールされると、背景画像はブラウザ ウィンドウに対して固定されたままになります。
- scroll: Web ページがスクロールされると、背景画像もブラウザ ウィンドウに対して一緒にスクロールします
##4. ブロック
1. 単語の間隔
word-spacing: 间隔距离
2. 文字の間隔
letter-spacing: 字母间距
text-align: 参数
パラメータ値:
- left: 左配置
- # right:右揃え
- ##center:中央揃え
##justify:相対的な左右の揃え
# #4. 垂直方向の配置- ##vertical-align: パラメータ
## bottom: 下揃え
- #text-top: 相対的なテキストの上揃え #text-bottom: 相対的なテキストの下揃え
-
##baseline: ベースラインの配置
- #middle: 中央揃え #sub: 添字形式で表示
- super: 上付き文字
- 5 の形式で表示します。テキストのインデント
text-indent: 缩进距离
ログイン後にコピー12px は、テキストの距離
に相当します。 6. スペースwhite-space: 参数
ログイン後にコピー通常通常- 事前予約済み
- nowrap no line Break
7. 表示スタイル
display: 参数
- block: ブロックレベル要素、オブジェクトの前後両方 改行
- inline: オブジェクトの前後に改行なし
#none: 表示しません
##5。箱###### ###### height 高度
width 宽度
padding 内边距
margin 外边距
float(浮动):可以让块级元素在一行中排列,例如横向菜单。
clear 清除浮动
六、边框
1、样式
border-style 参数
ログイン後にコピー边框样式的参数:
none:无边框
dotted:边框为点线
dashed:边框为长短线
solid:边框为实线
double:边框为双线
2、宽度
border-width:参数
ログイン後にコピー3、颜色
border-color:参数
ログイン後にコピー七、列表
list-style-type:列表样式
ログイン後にコピー不同浏览器的列表符可能不相同,可能会影响到网页,所以网页中的列表大多都是由背景图片显示。
控制用户界面的样式
八、鼠标
cursor:鼠标形状参数
ログイン後にコピーCSS鼠标形状参数表:
鼠标形状:CSS代码
style="cursor:hand" 手形 style="cursor:crosshair" 十字形 style="cursor:text" 文本形 style="cursor:wait" 沙漏形 style="cursor:move" 十字箭头形: style="cursor:help" 问号形 style="cursor:e-resize" 右箭头形 style="cursor:n-resize" 上箭头形 style="cursor:nw-resize" 左上箭头形 style="cursor:w-resize" 左箭头形 style="cursor:s-resize" 下箭头形 style="cursor:se-resize" 右下箭头形 style="cursor:sw-resize" 左下箭头形
ログイン後にコピー总结:
用常用HTML+CSS的代码做一个漂亮简单的个人网页,小伙伴来试试。
推荐学习:CSS视频教程
以上がWeb デザイン CSS スタイル コードの完全なコレクション、ぜひ集めてください。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック









HTMLはWeb構造を定義し、CSSはスタイルとレイアウトを担当し、JavaScriptは動的な相互作用を提供します。 3人はWeb開発で職務を遂行し、共同でカラフルなWebサイトを構築します。

vue.jsでBootstrapを使用すると、5つのステップに分かれています。ブートストラップをインストールします。 main.jsにブートストラップをインポートしますブートストラップコンポーネントをテンプレートで直接使用します。オプション:カスタムスタイル。オプション:プラグインを使用します。

ブートストラップスプリットラインを作成するには2つの方法があります。タグを使用して、水平方向のスプリットラインを作成します。 CSS Borderプロパティを使用して、カスタムスタイルのスプリットラインを作成します。

ブートストラップに画像を挿入する方法はいくつかあります。HTMLIMGタグを使用して、画像を直接挿入します。ブートストラップ画像コンポーネントを使用すると、レスポンシブ画像とより多くのスタイルを提供できます。画像サイズを設定し、IMG-Fluidクラスを使用して画像を適応可能にします。 IMGボーダークラスを使用して、境界線を設定します。丸い角を設定し、IMGラウンドクラスを使用します。影を設定し、影のクラスを使用します。 CSSスタイルを使用して、画像をサイズ変更して配置します。背景画像を使用して、背景イメージCSSプロパティを使用します。

Bootstrapフレームワークをセットアップするには、次の手順に従う必要があります。1。CDNを介してブートストラップファイルを参照してください。 2。独自のサーバーでファイルをダウンロードしてホストします。 3。HTMLにブートストラップファイルを含めます。 4.必要に応じてSASS/LESSをコンパイルします。 5。カスタムファイルをインポートします(オプション)。セットアップが完了したら、Bootstrapのグリッドシステム、コンポーネント、スタイルを使用して、レスポンシブWebサイトとアプリケーションを作成できます。

PHPでは、最終的なキーワードを使用して、クラスが継承されないようにし、メソッドが上書きされます。 1)クラスを決勝としてマークする場合、クラスを継承することはできません。 2)メソッドを最終的にマークする場合、メソッドはサブクラスによって書き換えられません。最終的なキーワードを使用すると、コードの安定性とセキュリティが保証されます。

ブートストラップボタンの使用方法は?ブートストラップCSSを導入してボタン要素を作成し、ブートストラップボタンクラスを追加してボタンテキストを追加します
