如何停止自动进入CSS？

问题描述：

我很喜欢html和css，因为我刚开始。我试图在创作中实现某些内容，但我不知道要删除标题中的自动输入内容。如何停止自动进入CSS？

@import url(https://fonts.googleapis.com/css?family=Fjalla+One); 
 

 

 
html{ 
 
    height: 100%; 
 
} 
 

 
body{ 
 
    font-family: 'Fjalla One', sans-serif; 
 
    background: linear-gradient(to bottom, #405166 0%, #656f6f 100%); 
 
} 
 

 
.container{ 
 
    margin: auto; 
 
} 
 

 

 
h1{ 
 
    text-transform: uppercase; 
 
    font-size: 42px; 
 
    line-height: 47px; 
 
    letter-spacing: 2px; 
 
    text-shadow: #533d4a 1px 1px, #533d4a 2px 2px, #533d4a 3px 3px, #533d4a 4px 4px; 
 
    text-align: center; 
 
} 
 

 

 
.title{ 
 
    transform: translateX(-50%) rotate(-5deg); 
 
    display: block; 
 
    margin-left:50%; 
 

 

 
}

<body> 
 
    <section class="container"> 
 
    <h1> 
 
    <br /> 
 
    <span class="title" style="color:#e55643;">Burger</span> 
 
    <span class="title" style="color:#2b9f5e;">school</span> 
 
    <span class="title" style="color:#f1c83c;">afspraken</span> 
 
    </h1> 
 
</section> 
 

 
</body>

我想有汉堡和相邻的学校，但不删除的颜色。

enter image description here

答

试试这个，......不知道这是你想要的东西

<body> 
    <section class="container"> 
    <h1> 
    <br /> 
    <span class="title" > 
     <label style="color:#e55643;">Burger</label> 
     <label style="color:#2b9f5e;">school</label> 
    </span> 
    <span class="title" style="color:#f1c83c;">afspraken</span> 
    </h1> 
</section> 

</body>

////////删除标签之间的空间做到这一点。

<body> 
    <section class="container"> 
    <h1> 
    <br /> 
    <span class="title" > 
     <label style="color:#e55643;">Burger</label><label style="color:#2b9f5e;">school</label> 
    </span> 
    <span class="title" style="color:#f1c83c;">afspraken</span> 
    </h1> 
</section>

删除标签应该是在同一线之间的空间，而空间

感谢您的帮助，这工作。还有一个问题，但现在汉堡和学校之间有一点空间。你知道如何解决这个问题吗？ –

我已编辑我的anwser检查出来，如果它有助于给大拇指 –

工作！感谢您的帮助 –

答

.title { display: block }引起该元件打入新行。使用display: inline-block将允许您将rotate元素保留在同一行上。

.title{ 
    transform: rotate(-5deg); 
    display: inline-block; 
}

补充阅读：https://css-tricks.com/almanac/properties/d/display/

@import url(https://fonts.googleapis.com/css?family=Fjalla+One); 
 

 

 
html{ 
 
    height: 100%; 
 
} 
 

 
body{ 
 
    font-family: 'Fjalla One', sans-serif; 
 
    background: linear-gradient(to bottom, #405166 0%, #656f6f 100%); 
 
} 
 

 
.container{ 
 
    margin: auto; 
 
} 
 

 

 
h1{ 
 
    text-transform: uppercase; 
 
    font-size: 42px; 
 
    line-height: 47px; 
 
    letter-spacing: 2px; 
 
    text-shadow: #533d4a 1px 1px, #533d4a 2px 2px, #533d4a 3px 3px, #533d4a 4px 4px; 
 
    text-align: center; 
 
} 
 

 

 
.title{ 
 
    transform: rotate(-5deg); 
 
    display: inline-block; 
 
}

<body> 
 
    <section class="container"> 
 
    <h1> 
 
    <br /> 
 
    <span class="title" style="color:#e55643;">Burger</span> 
 
    <span class="title" style="color:#2b9f5e;">school</span> 
 
    <span class="title" style="color:#f1c83c;">afspraken</span> 
 
    </h1> 
 
</section> 
 

 
</body>

谢谢你的帮助！ :) –

当然可以。继续，如果你的内容“接受”答案 – Wex

答

<h1> 
<br /> 
    <span class="title" style="color:#e55643;">Burger</span><span class="title" style="color:#2b9f5e;">school</span><span class="title" style="color:#f1c83c;">afspraken</span>

你将他们之间没有间隙现在:)

只写跨度在同一直线上，不在不同行

让我知道这是否工作

无论如何不工作 –

我检查了它，它的工作原理！只需在同一行写上所有的。 https://www.dropbox.com/s/txi35pf5jyez15m/Screen%20Shot%202017-04-17%20at%2019.36.43.png?dl=0 –

如何停止自动进入CSS？

相关推荐