Html 在CSS中对齐文本输入_Html_Css

Html 在CSS中对齐文本输入

html css

Html 在CSS中对齐文本输入,html,css,Html,Css,我是网络开发新手，正在尝试完成谷歌主页的盗版拷贝，但是由于某些原因，我正在使用的搜索栏无法与中心对齐我已经浏览了页面（）底部的解决方案，并在这里搜索了一个解决方案，但似乎什么都不起作用这是下面代码的链接和副本 HTML: 您的css部件有问题。你加了一个冒号而不是分号。除此之外，我觉得一切都很好改变这个表单输入{ 边框：实心1pxRGBA（0,0,0,2）；高度：30px；宽度：500px；位置：绝对位置；最高：53%；左：50%：转换：翻译（-50%，-50%）； }无

我是网络开发新手，正在尝试完成谷歌主页的盗版拷贝，但是由于某些原因，我正在使用的搜索栏无法与中心对齐

我已经浏览了页面（）底部的解决方案，并在这里搜索了一个解决方案，但似乎什么都不起作用

这是下面代码的链接和副本

HTML:

您的css部件有问题。你加了一个冒号而不是分号。除此之外，我觉得一切都很好改变这个

表单输入{
边框：实心1pxRGBA（0,0,0,2）；
高度：30px；
宽度：500px；
位置：绝对位置；
最高：53%；
左：50%：
转换：翻译（-50%，-50%）；
}

无需使用
位置：绝对
只需使用
文本对齐

正文{
背景色：#fff；
}
.标志{
边缘顶部：50px；
/*宽度：125px*/
/*最高：40%*/
/*左：50%*/
/*转换：翻译（-50%，-50%）*/
文本对齐：居中；
}
形式{
宽度：100%；
文本对齐：居中；
}
表单输入{
边框：实心1pxRGBA（0,0,0,2）；
高度：30px；
宽度：500px；
/*位置：绝对位置*/
/*最高：53%*/
/*左：50%：变换：平移（-50%，-50%）*/
}


谷歌

哦，天哪，这就解释了。非常感谢，我花了很长时间寻找这个问题。

<!DOCTYPE>
<html>
<head>
    <title>Google</title>
    <link href="styles/main.css" rel="stylesheet" type="text/css">
</head>
<body>
    <div class="logo">
        <img src="images/googlelogo.png" alt="Google Logo">
    </div>
    <form>
        <input type="text">
    </form>
</body>
</html>

body {
    background-color: #fff;
}
.logo {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
}
form input {
    border: solid 1px rgba(0, 0, 0, .2);
    height: 30px;
    width: 500px;
    position: absolute;
    top: 53%;
    left: 50%:
    transform: translate(-50%, -50%);
}