Eine komplette Sammlung von Webdesign-CSS-Stilcodes, kommen Sie und holen Sie sie ab!

Reduzieren Sie viel unnötigen Code, HTML + CSS können die Webseite einfach gestalten. Sammelt es, Freunde~

1. Texteinstellungen

1, font-size: Schriftgrößenparameter font-size: 字号参数 

2、font-style: 字体格式

3、font-weight: 字体粗细

4、颜色属性

color

2, Schriftstil: Schriftformat

3, font-weight: Schriftstärke4, FarbattributFarbe: Parameter
Hinweis Verwendung Websichere Farben

2. Hyperlink-Einstellungen

• text-decoration: 参数

  Der Hauptzweck besteht darin, die Unterstreichung zu ändern, wenn der Browser Textlinks anzeigt.

• Wertebereich des Parameters:

• underline: Unterstreiche den Text

• overline: unterstreiche den Text

• line-through: füge den Text durchgestrichen hinzu

blinken: Text erstellen blinken keine: Keine der oben genannten Effekte anzeigen

3. Hintergrund

1. Hintergrundfarbe

rrree

2. Hintergrundbild

background-color: 参数

• URL ist der Speicherpfad des Hintergrundbildes, „keine“ bedeutet „keine“.

• 3. Hintergrundbildwiederholung

  background-image: url(URL)

  Parameterwertebereich:

• no-repeat: Gekachelte Hintergrundbilder nicht wiederholen

repeat-x: Das Bild nur in horizontaler Richtung kacheln lassen

repeat-y: Das Bild nur in vertikaler Richtung kacheln lassen

• Wenn Sie das Hintergrundbild-Wiederholungsattribut nicht angeben, wird das Hintergrundbild standardmäßig sowohl in horizontaler als auch in vertikaler Richtung gekachelt.
  4. Hintergrundbild behoben
• Hintergrundbild behoben steuert, ob das Hintergrundbild beim Scrollen der Webseite mitläuft. Wenn Sie das Attribut „Hintergrundbild fest“ nicht festlegen, scrollt das Standardhintergrundbild des Browsers mit dem Scrollen der Webseite. Um zu vermeiden, dass übermäßig ausgefallene Hintergrundbilder die Aufmerksamkeit des Betrachters beim Scrollen ablenken, werden sie im Allgemeinen auf fest eingestellt.

  background-repeat: 参数

  Fenster, fest

scrollen: Wenn die Webseite gescrollt wird, scrollt das Hintergrundbild zusammen relativ zum Browserfenster

4. Block

1. Wortabstand

background-attachment: 参数

2, Buchstabe Abstand

word-spacing: 间隔距离

3. Textausrichtung

• letter-spacing: 字母间距

  Parameterwerte:

• left: linke Ausrichtung

• right: rechte Ausrichtung

• center: zentrierte Ausrichtung

justify: relative Links- und Rechtsausrichtung

• 4, vertikale Ausrichtung

• Vertical-Align: Parameter

• Top: Top-Pairing-Qi

• bottom: Gesamtausrichtung

• Text-Top: Relativer Text oben

• text-bottom: relative Textausrichtung unten

baseline: Grundlinienausrichtung

middle: zentrierte Ausrichtung

• sub: wird in Form von tiefgestellten Zeichen angezeigt

• super: wird in Form von hochgestellten Zeichen angezeigt

5. Texteinzug

• text-align: 参数

  12px entspricht einem Textabstand 6. Leerzeichen

• Block: Blockebene Elemente, Zeilenumbrüche vor und nach dem Objekt

inline: keine Zeilenumbrüche vor und nach dem Objekt
list-item: Zeilenumbrüche vor und nach dem Objekt, Aufzählungszeichen erhöhen

🎜🎜🎜🎜none: Keine Anzeige 🎜🎜🎜🎜🎜🎜 5. Box 🎜🎜 🎜🎜

• 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视频教程

Das obige ist der detaillierte Inhalt vonEine komplette Sammlung von Webdesign-CSS-Stilcodes, kommen Sie und holen Sie sie ab!. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!