Html 使用嵌入式CSS将图像添加到背景中_Html_Css

Html 使用嵌入式CSS将图像添加到背景中

html css

Html 使用嵌入式CSS将图像添加到背景中,html,css,Html,Css,我不熟悉HTML和CSS。我想在我的页面背景中添加一个图像，但我不知道怎么做我希望将CSS保留在页面内部，以便此背景图像由我页面的中的CSS指定： <!DOCTYPE html> <html> <head> <h2>How to write 'Text' in 6 of coding languages </h2> </head> <style> body { background-color: rgb(

我不熟悉HTML和CSS。我想在我的页面背景中添加一个图像，但我不知道怎么做

我希望将CSS保留在页面内部，以便此背景图像由我页面的

中的CSS指定：

<!DOCTYPE html>
<html>
<head>
  <h2>How to write 'Text' in 6 of coding languages </h2>
</head>
<style>
body {
 background-color: rgb(60, 60, 60);
 }

h2 {
 color: white;
 font-family: arial;
 font-size: 200%;
 }

h4 {
 color: white;
 font-family: arial;
 font-size: 165%;
 }

h6 {
 color: white;
 font-family: arial;
 font-size: 125%;
 }

p {
 color: white;
 font-family: arial;
 font-size: 100%;
 }
</style>
<body>
</body>
</html>


如何用6种编码语言编写“文本”
身体{
背景色：rgb（60,60,60）；
}
氢{
颜色：白色；
字体系列：arial；
字体大小：200%；
}
h4{
颜色：白色；
字体系列：arial；
字体大小：165%；
}
h6{
颜色：白色；
字体系列：arial；
字体大小：125%；
}
p{
颜色：白色；
字体系列：arial；
字体大小：100%；
}

您可以使用

背景

属性

<body background="bgimage.jpg">

您还可以使用

background

速记属性，它允许您设置不同的背景属性，包括

background image

body { 
  background: lightblue url("bgimage.jpg") no-repeat fixed center; 
}

您可以通过CSS属性设置页面背景的图像。在这里，通过URL指定背景图像，并将其应用于文档的

主体

元素：

body {
 background-color: rgb(60, 60, 60);

 /* Add this */
 background-image: url(https://www.vemco.com/wp-content/uploads/2012/09/image-banner2.jpg);
 }

以下是您现有HTML的完整示例：


如何用6种编码语言编写“文本”
身体{
背景色：rgb（60,60,60）；
/*加上这个*/
背景图片：url(https://www.vemco.com/wp-content/uploads/2012/09/image-banner2.jpg);
}
氢{
颜色：白色；
字体系列：arial；
字体大小：200%；
}
h4{
颜色：白色；
字体系列：arial；
字体大小：165%；
}
h6{
颜色：白色；
字体系列：arial；
字体大小：125%；
}
p{
颜色：白色；
字体系列：arial；
字体大小：100%；
}

查看CSS属性。您具体希望图像位于何处？哪一个元素的背景？只是想知道，我现在是否需要代码中的背景色，因为我有图像在那里？如果你想的话，你可以删除背景色。如果您保留指定的颜色，那么如果图像没有覆盖页面的

主体

元素，则该颜色将用于图像的外部。好的！非常感谢你。我有一种感觉是在CSS领域，但我对CSS的了解甚至比HTML还少，所以这让我的项目进展顺利。不客气-很高兴我能帮上忙，在你再次需要帮助的时候PM我：）当我有问题的时候我会的！

body {
 background-color: rgb(60, 60, 60);

 /* Add this */
 background-image: url(https://www.vemco.com/wp-content/uploads/2012/09/image-banner2.jpg);
 }