【发布时间】:2025-12-04 03:25:02
【问题描述】:
【我要全部提升:电话图标+号码块,社交媒体图标块和回调块到“特斯拉标志”级别。我尝试了填充和边距,但没有用1
【问题讨论】:
-
请具体说明问题并发布相关代码。根据您的屏幕截图,您的所有块似乎都是
div,并且您正试图将它们对齐。div恰好是block元素,因此请使用span和inline-block属性。
【我要全部提升:电话图标+号码块,社交媒体图标块和回调块到“特斯拉标志”级别。我尝试了填充和边距,但没有用1
【问题讨论】:
div,并且您正试图将它们对齐。 div 恰好是 block 元素,因此请使用 span 和 inline-block 属性。
我觉得对你有帮助
a {
text-decoration: none;
color: #333;
}
.top-header > div {
float: left;
padding: 0 15px;
}
.callback a {
background: lightblue;
border: 2px solid #333;
padding: 10px 20px;
border-radius: 10px;
display: inline-block;
margin-top: 20px;
}
<head>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="section">
<div class="top-header">
<div class="logo-block">
<img src="https://lorempixel.com/100/100/" />
</div>
<div class="phone-icon">
<p>
<i class="fa fa-phone-square" aria-hidden="true"></i> +1(55) 345 67 74
</p>
<p>
<i class="fa fa-phone-square" aria-hidden="true"></i> +1(44) 231 24 12
</p>
</div>
<div class="social-icon">
<p>
<i class="fa fa-envelope" aria-hidden="true"></i> hr@gmail.com
</p>
<a href="">
<i class="fa fa-twitter-square" aria-hidden="true"></i>
</a>
<a href="">
<i class="fa fa-vk" aria-hidden="true"></i>
</a>
<a href="">
<i class="fa fa-facebook-square" aria-hidden="true"></i>
</a>
</div>
<div class="callback">
<a href="">callback</a>
</div>
</div>
</div>
</body>
【讨论】: