Html 使用照片作为<；h1>；在CSS中_Html_Css_Image_Image Replacement

Html 使用照片作为<；h1>；在CSS中

html css image

Html 使用照片作为<；h1>；在CSS中,html,css,image,image-replacement,Html,Css,Image,Image Replacement,在我的学校里，他们说如果我们用一张图片作为标题，用一种特殊的字体来表示前男友，这是一种可行的方法。现在，我正在尝试，但我真的不明白 1）你为什么要这么做 2）除非给它一个特定的高度，否则它似乎不会出现有人能告诉我一个更好的方法来做这件事吗什么 .title{ 背景图片：url（…）；背景重复：无重复； /*现在它什么也不显示，只有在我在这里添加高度时才显示*/ } titlespan先生{ 可见性：隐藏； } 如果您想显示图像而不是文本，这就足够了： h1{ 背景图片：url（…）

在我的学校里，他们说如果我们用一张图片作为标题，用一种特殊的字体来表示前男友，这是一种可行的方法。现在，我正在尝试，但我真的不明白

1）你为什么要这么做

2）除非给它一个特定的高度，否则它似乎不会出现

有人能告诉我一个更好的方法来做这件事吗

什么

.title{
背景图片：url（…）；
背景重复：无重复；
/*现在它什么也不显示，只有在我在这里添加高度时才显示*/
}
titlespan先生{
可见性：隐藏；
}

如果您想显示图像而不是文本，这就足够了：

h1{
背景图片：url（…）；
背景重复：无重复；
宽度：100px/*图像宽度*/；
高度：25px/*图像高度*/；
文本缩进：-9999px；/*此隐藏文本*/；
}

Title

如果您想显示图像而不是文本，这就足够了：

h1{
背景图片：url（…）；
背景重复：无重复；
宽度：100px/*图像宽度*/；
高度：25px/*图像高度*/；
文本缩进：-9999px；/*此隐藏文本*/；
}

标题

只要有内容就行，否则必须给出高度/宽度

.title{
背景图片：url(https://media-exp1.licdn.com/media/AAEAAQAAAAAAAANbAAAAJDE5NjBkNDk1LTY3ZGQtNDA0NS04YTJiLTdkNmU3NjZiNjI3Mg.png);
背景重复：无重复；
/*现在它什么也不显示，只有在我在这里添加高度时才显示*/
}
titlespan先生{
可见性：隐藏；
}

a
a
a
a
a
a
a

只要有内容就行，否则必须给出高度/宽度

.title{
背景图片：url(https://media-exp1.licdn.com/media/AAEAAQAAAAAAAANbAAAAJDE5NjBkNDk1LTY3ZGQtNDA0NS04YTJiLTdkNmU3NjZiNjI3Mg.png);
背景重复：无重复；
/*现在它什么也不显示，只有在我在这里添加高度时才显示*/
}
titlespan先生{
可见性：隐藏；
}

a
a
a
a
a
a

您不应仅对图像使用

h#

，因为这些标签具有特殊意义。例如，

h1

表示页面标题

是的，如果只有图像作为背景，则必须设置元素尺寸（默认情况下，所有块元素的宽度都设置为

100%

）

我将使用简单的

div

（另一个选项是

标记，它将自动调整大小以适应源维度）：

#标题{
高度：50px；
背景：url（'http://via.placeholder.com/50x50'）重复-x中心；
}

您不应仅对图像使用

，因为这些标记具有特殊意义。例如，

h1

表示页面标题

是的，如果只有图像作为背景，则必须设置元素尺寸（默认情况下，所有块元素的宽度都设置为

100%

）

我将使用简单的

div

（另一个选项是

标记，它将自动调整大小以适应源维度）：

#标题{
高度：50px；
背景：url（'http://via.placeholder.com/50x50'）重复-x中心；
}

我是一名学生，在学校里他们说如果我们使用带有特殊字体的图像作为标题

使用带有文字的图像以这种方式替换标题不是一个好主意，因为由于尺寸和分辨率的原因，文本（图像文本）在不同屏幕上的显示方式可能不同

如果图像只是背景，这种方法似乎是正确的。文本在

标签中完成，标签反过来是可见的，而不是隐藏的

可以为CSS中的

h1

或

span

设置特殊字体。（在本例中，字体与html中的google字体链接）

.title{
背景图片：url(https://png.pngtree.com/thumb_back/fh260/back_pic/00/05/81/6456279a0080dd1.jpg);
背景重复：无重复；
文本对齐：居中；
}
titlespan先生{
字体系列：“深红色文本”，衬线；
颜色：白色；
}


这是标题