html如何在背景的基础上添加文字,如何创建背景图片并在其上添加文字
要开始我是非常新的自举,但我想要做一些类似于这个例子:text over background image但在一个引导框架内。我曾尝试在导航栏下面的容器内创建一个div,但似乎在背后的文字背后放置了白色背景......您可以在此处看到我的代码:JSFiddle:my code。或者是如下:如何创建背景图片并在其上添加文字CSSbody {margin-top: 50px; /* Required
要开始我是非常新的自举,但我想要做一些类似于这个例子:text over background image但在一个引导框架内。我曾尝试在导航栏下面的容器内创建一个div,但似乎在背后的文字背后放置了白色背景......您可以在此处看到我的代码:JSFiddle:my code。或者是如下:如何创建背景图片并在其上添加文字
CSS
body {
margin-top: 50px; /* Required margin for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
}
@import url(http://fonts.googleapis.com/css?family=Oswald:700);
html {
background: url(http://3.bp.blogspot.com/_6r-mOI0OuO0/S6q3VodCqI/AAAAAAAAB5A/Uycl8dCr92A/s1600/NYC15BrooklynBridge02.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
font-family: 'Oswald', sans-serif;
}
h1 {
color: #fff;
text-align: center;
font-size: 120px;
text-transform: uppercase;
}
span {
font-size: 130px;
color: transparent;
text-shadow: 0 0 10px #fff;
}
HTML
Full - Start Bootstrap Template@import url(http://fonts.googleapis.com/css?family=Oswald:700);
h1 {
color: #FF6600;
text-align: center;
font-size: 120px;
text-transform: uppercase;
}
span {
font-size: 130px;
color: transparent;
text-shadow: 0 0 10px #FF6600;
}
some text
some other text
更多推荐
所有评论(0)