Grundlegende Verwendung css -03

CSS Schriftstilattribute

1.font Schriftart

1.1 font-size: Größe

• Rolle:

  font-size Eigenschaft wird verwendet, um die Schriftgröße einstellen

  p {  
      font-size:20px; 
  }
  

• Einheit:

  • Relative Längeneinheit kann verwendet werden, was eine absolute Längeneinheiten können auch verwendet werden.
  • Die relativen Längeneinheiten häufig verwendet, empfehlen wir die Pixeleinheit px, weniger absolute Längeneinheiten.
    

• Hinweis:

  • Gemeinsame Einheiten px
  • Google-Browser-Standardtextgröße ist 16px
  • Verschiedene Browser kann die Standardschriftgröße ist inkonsistent angezeigt werden, versuchen, einen klaren Mehrwert Größe zu geben, nicht Standardgröße. Allgemein, um den Körper die gesamte Seite Textgröße bezeichnet

1.2 font-family: Schrift

• Rolle:

  font-family-Eigenschaft wird verwendet, um die Schrift zu setzen.

  p{ font-family:"微软雅黑";}
  

• Web-Seite häufig verwendete Schriften sind Arial, Microsoft elegante schwarze, schwarzer Körper, usw.

• Sie können mehrere Schriftarten gleichzeitig angeben, in der Mitte durch Kommata getrennt, sagte, dass, wenn der Browser nicht die erste Schriftart nicht unterstützt, es die nächsten versucht, bis Sie die richtige Schriftart finden, wenn nicht alle, unsere Computer Orten die Standardschriftart maßgebend.

  p{font-family: Arial,"Microsoft Yahei", "微软雅黑";}
  

  1. 各种字体之间必须使用英文状态下的逗号隔开。
  2. 中文字体需要加英文状态下的引号，英文字体一般不需要加引号。当需要设置英文字体时，英文字体名必须位于中文字体名之前。
  3. 如果字体名中包含空格、#、$等符号，则该字体必须加英文状态下的单引号或双引号，例如font-family: "Times New Roman";。
  4. 尽量使用系统默认字体，保证在任何用户的浏览器中都能正确显示。
  

1.2.1 CSS Unicode-Schriften

• Warum Unicode-Schriftarten verwenden

  • Stellen Sie die Schriftnamen in der CSS, ist die direkte Schreib Chinesisch möglich. Jedoch wird in der Codierungsdatei (GB2312, UTF-8, etc.) werden Verzeichnung Fehlanpassungsfehler erzeugen.
  • XP-System nicht unterstützt ähnlich wie Microsoft elegante schwarze Chinesen.

• Lösung:

  • Eine Option: Sie können Englisch verwenden statt. Zum Beispiel font-family:"Microsoft Yahei".

  • Option Zwei: Verwenden Sie Unicode codiert direkt im CSS den Namen der Schrift zu schreiben, um diese Fehler zu vermeiden. Verwenden Sie Unicode-Schriftart chinesische Namen zu schreiben, der Browser Auflösung korrigieren.

    font-family: "\5FAE\8F6F\96C5\9ED1";   表示设置字体为“微软雅黑”。
    

    Körper Name	Englisch Name	Unicode-Codierung
    Körper	SimSun	\ 5B8B \ 4F53
    Times New Roman	NSimSun	\ 65B0 \ 5B8B \ 4F53
    Körper	SimHei	\ 9ED1 \ 4F53
    Weiche elegant schwarz	Microsoft YaHei	\ 5FAE \ 8F6F \ 96C5 \ 9ED1
    Körper _GB2312	KaiTi_GB2312	\ 6977 \ 4F53_GB2312
    Buch	Lisa	\ 96B6 \ 4E66
    Garten	Youyuan	\ 5E7C \ 5706
    Wen dünne schwarze	STXihei	\ 534E \ 6587 \ 7EC6 \ 9ED1
    Ming	MingLiU	\ 7EC6 \ 660E \ 4F53
    Feiner Ming	PMingLiU	\ 65B0 \ 7EC6 \ 660E \ 4F53

1.3 font-weight: Die Schriftstärke

• Und b-Tags können Text fett stark machen.

• Font-weight-Eigenschaft verwenden

  Eigenschaftswert	Beschreibung
  normal	Der Standardwert (nicht fett)
  Fett gedruckt	Definiert das Fett (fett)
  100 ~ 900	400 entspricht dem normalen, fett und ist äquivalent zu 700

1.4 font-style: Schriftstil

• Ich mit Kursivschrift und em-Tags implementiert werden können,

• Verwenden font-style-Eigenschaft, die den Schriftstil definiert

  Immobilien	Wirkung
  normal	Standardmäßig zeigt der Browser den Standard Schriftart, Schriftstil: normal;
  kursiv	Der Browser zeigt kursiv Schriftstil.

1.5 Schrift: Umfassende Set Schriftstil

Schriftattribute an den Schriftstil für einen umfassenden Satz

• Die grundlegende Syntax lautet wie folgt:

  选择器 { font: font-style  font-weight  font-size/line-height  font-family;}
  

• Hinweis:

  • Wenn die Schriftart - Attribut Syntax muss über Auftrag schriftlich sein, können Sie die Reihenfolge der jeweiligen Immobilie nicht ändern Raum auseinander.
  • Keine Notwendigkeit, diese Eigenschaften liefern kann (Standardwert) weggelassen wird, sondern muss das font-size-Attribut und font-family, font-Eigenschaft wird nicht funktionieren, sonst behalten.

1.6 Schrift Zusammenfassung

Immobilien	Show	Bemerkung
Schriftgröße	Schriftgröße	Die Einheiten sind in der Regel px Pixel, müssen Einheiten halten
Schriftfamilie	Fonts
font-weight	Schriftstärke	700 oder fett fett fett ist nicht normal, oder 400-Nummern setzen Sie das Gerät nicht sagen,
font-style	Schriftstil	Kursiv slant ist nicht geneigt ist normal
Schriftart	Font Ligatur	1. Font Ligaturen sind sequentiell und nicht die Schriftgröße ändern, und wobei die Position 2 muss gleichzeitig auftreten

2. CSS Eigenschaften des Aussehens

2.1 Farbe: Textfarbe

• Rolle:

  Farbe definiert die Farbe von Text,

• Eigenschaftswerte sind wie folgt:

  Express Express	Eigenschaftswert
  Vordefinierte Farbwert	rot grün blau
  Fluch	# FF0000, # FF6600 können # f00 rot Vertreter abgekürzt werden, gemeinsame
  RGB-Codes	rgb (255,0,0) oder RGB (100%, 0%, 0%)

2.2 text-align: horizontale Ausrichtung von Text

• Rolle:

  Level text-align Eigenschaft wird verwendet, um die Ausrichtung des Textinhaltes zu setzen, um entsprechendes Attribut ALIGN HTML-Tag

• Eigenschaftswerte sind wie folgt:

  Immobilien	Erklärung
  links	Left (Standardwert)
  Recht	Rechts ausrichten
  Center	居中对齐

• 注意：

  是让盒子里面的内容水平居中， 而不是让盒子居中对齐

2.3 line-height:行间距

• 作用：

  line-height属性用于设置行间距，就是行与行之间的距离，即字符的垂直间距，一般称为行高。

• 单位：
  像素px，相对值em和百分比%，常用像素px

• 注：
  一般情况下，行距比字号大7.8像素左右就可以了。

2.4 text-indent:首行缩进

• 作用：

  text-indent属性用于设置首行文本的缩进

• 属性值

  • 其属性值可为不同单位的数值、em字符宽度的倍数、或相对于浏览器窗口宽度的百分比%，允许使用负值

  • 建议使用em作为设置单位。

    p {
          /*行间距*/
          line-height: 25px;
          /*1em 就是一个字的宽度 如果是汉字的段落， 1em 就是一个汉字的宽度*/
          /*首行缩进2个字  em  1个em 就是1个字的大小*/
          text-indent: 2em;  
     }
    

2.5 text-decoration 文本的装饰

text-decoration 通常用于给链接修改装饰效果

值	描述
none	默认。定义标准的文本。 取消下划线（最常用）
underline	定义文本下的一条线。下划线 也是我们链接自带的（常用）
overline	定义文本上的一条线。（不用）
line-through	定义穿过文本下的一条线。（不常用）

2.6 CSS外观属性总结

属性	表示	注意点
color	颜色	我们通常用 十六进制 比如 而且是简写形式 #fff
line-height	行高	控制行与行之间的距离
text-align	水平对齐	可以设定文字水平的对齐方式
text-indent	首行缩进	通常我们用于段落首行缩进2个字的距离 text-indent: 2em;
text-decoration	文本修饰	记住 添加 下划线 underline 取消下划线 none