Heim >Web-Frontend >CSS-Tutorial >Wie füge ich CSS in HTML ein? Einführung in vier Methoden zum Einfügen von CSS in HTML (mit Code)
Der Inhalt dieses Artikels befasst sich mit der Frage, wie man CSS in HTML einfügt. Eine Einführung in die vier Methoden zum Einfügen von CSS in HTML (mit angehängtem Code) hat einen gewissen Referenzwert. Ich hoffe, dass sie für Sie hilfreich ist.
1. HTML-Kommentare:
(2). CSS-Kommentare: /* *
(1). Inline-Stil (schreiben Sie den Stil direkt nach dem Tag)
<!doctype html> <html> <head> <meta charset="utf-8"> <title>行内样式</title> </head> <body> <p style="font-famliy:宋体; text-align:center;font-style:italic; text-transform:uppercase; font-size:22px; text-decoration:underline; font-weight:bold; letter-spacing:13px">html中插入css样式的方法:</br>1 行内样式;2 内部样式; <br/>3 外部样式; 4 导入样式;</p> </body> </html>(2) Eingebettet (schreiben Sie den Stil und die HTML-Sprache separat)
<!doctype html><html><head> <meta charset="utf-8"> <title>行内样式</title> <style type="text/css"> p{ text-decoration:underline; text-align:center; font-size:26px; font-family:宋体; font-weight:bolder; text-transform:lowercase; letter-spacing:4px; color:pink; background-color:green; } </style></head><body> <p >HTML中插入CSS样式的方法:</br> 1 行内样式;2 内部样式; <br/> 3 外部样式; 4 导入样式; </p></body></html>3 . Externer Stil (Linkstil: CSS und HTML separat schreiben)! ! ! ! Das am häufigsten verwendete
first.html
<!doctype html><html><head> <meta charset="utf-8"> <title>行内样式</title> <link href="first.css" type="text/css" rel="stylesheet"></head><body> <p >HTML中插入CSS样式的方法:</br> 1 行内样式;2 内部样式; <br/> 3 外部样式; 4 导入样式; </p></body></html>first.css
p{ text-decoration:underline;/*加下划线*/ text-transform:lowercase;/*大写字母全部小写*/ text-align:center;/*居中*/ font-size:23px;/*字体大小*/ font-family:黑体;/*设置字体*/ font-style:italic;/*设置字倾斜*/ text-indent:3px;/*设置首行缩进*/ color:red;/*设置字体颜色*/ background-color:#ddd;/*设置背景颜色*/ letter-spacing:4px;}Importiert
first.html
<!doctype html><html><head> <meta charset="utf-8"> <title>行内样式</title> <style type="text/css"> @import url(first.css); </style></head><body> <p >HTML中插入CSS样式的方法:</br> 1 行内样式;2 内部样式; <br/> 3 外部样式; 4 导入样式; </p></body></html>first.css
p{ text-decoration:underline;/*加下划线*/ text-transform:lowercase;/*大写字母全部小写*/ text-align:center;/*居中*/ font-size:33px;/*字体大小*/ font-family:黑体;/*设置字体*/ font-style:italic;/*设置字倾斜*/ text-indent:3px;/*设置首行缩进*/ color:red;/*设置字体颜色*/ background-color:#ddd;/*设置背景颜色*/ letter-spacing:4px;}Verwandte Empfehlungen:
JavaScript-Methode zum dynamischen Einfügen von CSS_Javascript-Kenntnissen
Das obige ist der detaillierte Inhalt vonWie füge ich CSS in HTML ein? Einführung in vier Methoden zum Einfügen von CSS in HTML (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!