Heim > Artikel > Web-Frontend > CSS persönliche Zusammenfassung
1.什么是css,指的是叠层样式表,控制网页的的外观显示。
2.引入css的三种方式,外部链接,内部链接,内联,分别的语法是,,,style="属性:值"
3.css选择器,选择器就是要针对你要所改变的元素,而单独定义的样式,就常见的选择器:ID,CLASS,元素选择器,子元素选择器,群组选择器,相邻选择器,id选择器是唯一的意思是,只能定义一个id名相同的,class选择器,类选择器,可以为多个元素定义,id选择器和class选择器的区别在于,id是唯一的就像每个人的身份证一样只有一份号码是唯一的,而class就是像每个人的名字一样可以重复,元素选择器就是选泽要改变的元素标签名字,子选择器就是在当前元素后的子元素,群组合选择器就是选泽所有想改变的元素,相邻选择器就在当前同级元素的下一个元素。
语法:
这是一个段落
相应的 css规则: #id{ 属性:值}相应的css规则:.class{ 属性:值}
这是一个段落
相应的css规则:p{属性:值}
这是一个段落奥
这是一个段落奥
这是一个段落奥
相应的css规则:div+div{属性:值}
这是一个段落奥
4. Schriftstil
Schrifttyp: Schriftfamilie: '';Wert: Songti, Microsoft Yahei usw.,
Schriftgröße: Schriftgröße:; normalerweise in Pixelwert px, andere umfassen em, Prozentsatz
Schriftstärke: Schriftstärke:; Wert fett wird fett angezeigt, normal ist normal
Schriftstil: Schriftstil:; kursiv, normal
Farbe; Farbe
Zeilenhöhe:; Die Zeilenhöhe der Schriftart, die Höhe einer Zeile ist nicht der Abstand.
5. Textstil
Textdekoration: text-decoration:; Die Werte sind, line-through (durchgestrichen), underline (underline), overline (overline)
Textausrichtung: text-align:; die Werte sind: center (zentriert), left (linksbündig), right (rechtsbündig)
Texteinzug: text-ident:; Werteinheit px.em, Prozentsatz
Text-Case: text-transform:; Die Werte sind Großbuchstaben (Großbuchstaben), Kleinbuchstaben (Kleinbuchstaben) und Großbuchstaben (erste Ziffer großgeschrieben)
Wortabstand des Textes: Buchstabenabstand:; Werteinheit px, em, Prozentsatz
Wort-Sapcing:; Werteinheit px, em, Prozentsatz
6. Rand
Rahmengröße, Typ, Farbe, separate Einstellungen
border-width:; Der Wert ist in px em Prozentsatz
border-style:; Der Wert ist durchgezogen, durchgezogen, gestrichelt, gepunktet usw.
border-color:; Wertfarbe, die hexadezimal sein kann.
7. Hintergrund
Hintergrundbild, ob der Hintergrund wiederholt wird, die Position des Hintergrunds und ob die Hintergrund-Scrolls
sindHintergrund: URL;
Hintergrundwiederholung:; der Wert ist, wiederholen (wiederholen) no-repeat (nicht wiederholt) wiederholen-x (x-Achsen-Wiederholung) wiederholen-y (y-Achsen-Wiederholung)
Hintergrundposition:; der Wert kann Mitte links rechts oben sein
background-scroll:; Der Wert ist scrollfest
kann abgekürzt werden; Hintergrund: URL-Wiederholungspositionsscrollen;
8.Hyperlink-Stil
Wenn wir die Maus über das a-Tag bewegen, kann der angezeigte Stil über Pseudoklassen festgelegt werden. Es ist nicht unbedingt das a-Element, das festgelegt werden kann. In HTML können Pseudoklassen festgelegt werden. Syntax: Element: hover
Style a:link; wenn die Maus nicht besucht wird; style a:visited, wenn die Maus bewegt wird;
9 Bilder
Bildgröße: Sie können es festlegen, indem Sie die Breite und Höhe festlegen.
Bildposition: über text-align (horizontal zentriert), Vertical-align (vertikal zentriert)
Bildrand: Legen Sie den Rand durch den Rand fest
10 Liste
Listenstil: Listenstiltyp:; Werte keine, Kreis usw.
List-image:list-style-image:;
Formular 11
Die Tabelle hat standardmäßig keinen Rand, ich möchte ihr durch den Rand einen Wert geben
12, Boxmodell
Das Box-Modell ist unterteilt in: Inhaltsbereich, Innenrand, Außenrand, Rand
13 Layouts
Floating-Layout: Float-Blockelemente durch Float, achten Sie darauf, den Float zu löschen.
Positionierungslayout: festzulegende Position. Dann einstellen. Die Werte für oben, rechts, unten und links.
Feste Positionierung: Position: fest/scrollen
Statische Positionierung: Position: statisch