我开始制作一个没有的页面
<!doctype html>
,
但是当我添加这一行时
<!doctype html>
我的代码无法正确显示。问题出在哪儿? (如果我的代码看起来很糟糕,很难并且有错误,请抱歉。
我只是前端的新手。如果你能帮助我,我将非常感激。
<html>
<head>
<title> Repear phones, laptops, tablets. Replacement screen, battery, touch screen. Unlock and re-flashing phone.</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div class="visit-card">
<div class="visit-card__part-1">
<table class="visit-card__part-1__table">
<tr>
<td class="visit-card__part-1__table__logo">
<img class="visit-card__part-1__logo" src="images/servis-plus.png" alt="Service-plus.by">
</td>
<td class="visit-card__part-1__table__tel-1">
<span class="visit-card__part-1__table__tel-1__number">+375291386105</span> <br /> <span class="visit-card__part-1__table__tel-1__time">10:00-20:00</span><span class="visit-card__part-1__table__tel-1__empty">11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111</span
</td>
<td class="visit-card__part-1__table__empty-block">
</td>
<td class="visit-card__part-1__table__tel-2">
+375293711698
</td>
</tr>
</table>
</div>
<div class="visit-card__part-2">
<div class="visit-card__part-2__headline"> Quickly need <br /> repair device?
</div>
</div>
</div>
</body>
</html>
body {
margin: 0;
}
.visit-card {
width: 1280px;
height: 750px;
background-size: 1280px 750px;
background-image: url(images/main-bg.jpg);
}
.visit-card__part-1__logo {
width: 191px;
height: 78px;
}
.visit-card__part-1__table {
width: 100%;
height: 140px;
color: white;
font-family: arial;
font-size: 24;
border-bottom: 1px solid #80705c;
}
.visit-card__part-1__table__logo {
text-align: right;
width: 270px;
}
.visit-card__part-1__table__tel-1 {
text-align: right;
vertical-align: top;
}
.visit-card__part-1__table__tel-2 {
vertical-align: top;
}
.visit-card__part-1__table__tel-1__time {
font-size: 17;
line-height: 1%;
}
.visit-card__part-1__table__tel-1__empty {
visibility: hidden;
font-size: 1;
}
.visit-card__part-1__table__tel-1__number {
line-height: 75px;
}
.visit-card__part-1__table__tel-2 {
line-height: 75px;
}
.visit-card__part-1__table__empty-block {
width: 65px;
}
.visit-card__part-2__headline {
color: white;
}
答案 0 :(得分:4)
当你添加<!doctype html>
时,你需要更加小心你的html和css。首先修复结束标记中的span
拼写错误。但是你还需要在css中为你的字体大小添加单位:
例如:
.visit-card__part-1__table__tel-1__time {
font-size: 17px;
line-height: 1%;
}
需要为17px
而不是17
。我认为你的css中有三种字体大小,没有单位。改变它应该解决它。