C# 旋转木马文本不是';不在图片上显示吗?
我使用了w3school引导主题,但是图片上应该显示的文本没有显示出来。我确实更改了图像,所以可能有问题,希望您能提供帮助 当我运行我的网页时,我看不到滑块上的文本,并且尝试了许多不同的事情,但没有结果 这是我的代码,非常新,所以不确定我是否正确地执行了代码块,以便向您展示它C# 旋转木马文本不是';不在图片上显示吗?,c#,html,css,carousel,C#,Html,Css,Carousel,我使用了w3school引导主题,但是图片上应该显示的文本没有显示出来。我确实更改了图像,所以可能有问题,希望您能提供帮助 当我运行我的网页时,我看不到滑块上的文本,并且尝试了许多不同的事情,但没有结果 这是我的代码,非常新,所以不确定我是否正确地执行了代码块,以便向您展示它 <html lang="en"> <head> <!-- Theme Made By www.w3schools.com - No Copyright --> <title>
<html lang="en">
<head>
<!-- Theme Made By www.w3schools.com - No Copyright -->
<title>Bootstrap Theme The Band</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.container {
padding: 80px 120px;
}
.person {
border: 10px solid transparent;
margin-bottom: 25px;
width: 80%;
height: 80%;
opacity: 0.7;
}
.person:hover {
border-color: #f1f1f1;
}
.carousel-inner img {
/*-webkit-filter: grayscale(90%);*/
/*filter: grayscale(90%); /* make all photos black and white */
width: 100%; /* Set width to 100% */
margin: auto;
}
.carousel-caption h3 {
color: #fff !important;
}
.carousel-caption {
display: none; /* Hide the carousel text when the screen is less than 600 pixels wide */
}
.navbar {
margin-bottom: 0;
background-color: #2d2d30;
border: 0;
font-size: 11px !important;
letter-spacing: 4px;
opacity: 0.9;
}
.navbar li a, .navbar .navbar-brand {
color: #d5d5d5 !important;
}
.navbar-nav li a:hover {
color: #fff !important;
}
.navbar-nav li.active a {
color: #fff !important;
background-color: #29292c !important;
}
.navbar-default .navbar-toggle {
border-color: transparent;
}
.open .dropdown-toggle {
color: #fff;
background-color: #555 !important;
}
.dropdown-menu li a {
color: #000 !important;
}
.dropdown-menu li a:hover {
background-color: red !important;
}
footer {
background-color: #2d2d30;
color: #f5f5f5;
padding: 32px;
}
footer a {
color: #f5f5f5;
}
footer a:hover {
color: #777;
text-decoration: none;
}
</style>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data- toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Logo</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><a href="#myPage">Algorithmer/Robothandel</a></li>
<li><a href="#band">Analyser/Trading idéer</a></li>
<li><a href="#tour">Tradingskolan</a></li>
<li><a href="#contact">Kontakt</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
MORE
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li><a href="#">Merchandise</a></li>
<li><a href="#">Extras</a></li>
<li><a href="#">Media</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="~/images/Buysell.png" alt="New York" width="1200" height="700">
<div class="carousel-caption">
<h3>New York</h3>
<p>Syns texten någonstans?.</p>
</div>
</div>
<div class="item">
<img src="~/images/surf.jpg" alt="Chicago">
<div class="carousel-caption">
<h3>Chicago</h3>
<p>Thank you, Chicago - A night we won't forget.</p>
</div>
</div>
<div class="item">
<img src="~/images/kite.png" alt="Los Angeles" width="1200" height="700">
<div class="carousel-caption">
<h3>LA</h3>
<p>Even though the traffic was a mess, we had the best time playing at Venice Beach!</p>
</div>
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"> </span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"> </span>
<span class="sr-only">Next</span>
</a>
</div>
<div class="container text-center">
<h3>En sida om trading</h3>
<p><em>Följ din dröm!</em></p>
<p>mmmmmmmmmmmmmmmmmm sssssssssssssss sssss
ssssssssssssssssss fffffffffffffffff fffffffffffff
ffffffffffffff ffffffffffff ffffffffffffffff
ve created a fictional band website. Lorem ipsum..</p>
<br>
<div class="row">
<div class="col-xs-4">
<p class="text-center"><strong>Algoritmer/Robothandel</strong> </p><br>
<a href="#demo" data-toggle="collapse">
<img src="~/images/robot.png" class="img-circle person" alt="Random Name" width="255" height="255">
</a>
<div id="demo" class="collapse">
<p>Guitarist and Lead Vocalist</p>
<p>Loves long walks on the beach</p>
<p>Member since 1988</p>
</div>
</div>
<div class="col-xs-4">
<p class="text-center"><strong>Analyser/Trading idéer</strong></p><br>
<a href="#demo2" data-toggle="collapse">
<img src="~/images/kite.png" class="img-circle person" alt="Random Name" width="255" height="255">
</a>
<div id="demo2" class="collapse">
<p>Drummer</p>
<p>Loves drummin'</p>
<p>Member since 1988</p>
</div>
</div>
<div class="col-xs-4">
<p class="text-center"><strong>Tradingskolan</strong></p><br>
<a href="#demo3" data-toggle="collapse">
<img src="~/images/skolan.png" class="img-circle person" alt="Random Name" width="255" height="255">
</a>
<div id="demo3" class="collapse">
<p>Bass player</p>
<p>Loves math</p>
<p>Member since 2005</p>
</div>
</div>
</div>
</div>
<footer class="text-center">
<p>Bootstrap Theme Made By <a href="https://www.w3schools.com" data-toggle="tooltip" title="Visit w3schools">www.w3schools.com</a></p>
</footer>
</body>
</html>
引导主题乐队
.集装箱{
填充:80px 120px;
}
.人{
边框:10px实心透明;
边缘底部:25px;
宽度:80%;
身高:80%;
不透明度:0.7;
}
.人:悬停{
边框颜色:#f1f1;
}
.旋转木马内部img{
/*-webkit过滤器:灰度(90%)*/
/*滤镜:灰度(90%);/*使所有照片黑白*/
宽度:100%;/*将宽度设置为100%*/
保证金:自动;
}
.旋转木马标题h3{
颜色:#fff!重要;
}
.旋转木马标题{
显示:无;/*当屏幕宽度小于600像素时隐藏旋转木马文本*/
}
navbar先生{
页边距底部:0;
背景色:#2d30;
边界:0;
字体大小:11px!重要;
字母间距:4px;
不透明度:0.9;
}
.navbar li a、.navbar.navbar品牌{
颜色:#d5d5d5!重要;
}
.导航栏导航李a:悬停{
颜色:#fff!重要;
}
.导航栏导航李.主动a{
颜色:#fff!重要;
背景色:#29292c!重要;
}
.navbar默认值.navbar切换{
边框颜色:透明;
}
.打开.下拉开关{
颜色:#fff;
背景色:#555!重要;
}
.下拉菜单LIA{
颜色:#000!重要;
}
.下拉菜单li a:悬停{
背景色:红色!重要;
}
页脚{
背景色:#2d30;
颜色:#F5;
填充:32px;
}
页脚a{
颜色:#F5;
}
页脚a:悬停{
颜色:#777;
文字装饰:无;
}
-
纽约
Syns texten någonstans
芝加哥
谢谢你,芝加哥——一个我们不会忘记的夜晚。
洛杉矶
尽管交通混乱,我们还是在威尼斯海滩玩得很开心
恩斯达姆贸易公司
Följ din dröm
mmmmmmmmmmmmmmmmmmmmmmmmsssssssssss
SSSSSSSSSSSSSSSSFFFFFFFFFFFFFFFFFFFFFFFFFFFFF
FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF
我创建了一个虚构的乐队网站。同侧眼睑
Algoritmer/Robothandel
吉他手兼主唱
喜欢在海滩上散步
1988年以来的成员
分析器/交易idéer
鼓手
喜欢鼓声'
1988年以来的成员
Tradingskolan
贝司手
热爱数学
2005年以来的成员
引导主题由
当我运行您的代码时,我可以看到您的css样式设置为“无显示”
.carousel-caption {
display: none;
}
如果您将此注释掉/*显示:无;*/或者改成
.carousel-caption {
display: block;
}
这将显示图像上方的文本。从css中删除以下代码:
.carousel-caption {
display: none;
/* Hide the carousel text when the screen is less than 600 pixels wide */
}
上述文本应放在媒体查询中,以在小于600px的屏幕上隐藏文本
如果您希望实现相同的目标,您可以改为附加以下代码:
@media only screen and (max-width: 600px) {
.carousel-caption {
display: none;
/* Hide the carousel text when the screen is less than 600 pixels wide */
}
}
谢谢,不过我没有让@media工作。它说“媒体名称在当前上下文中不存在”。不确定要做什么。样式标记中应使用@media