如何将任何html内容集中在浏览器的中心？_Html_Browser_Center

如何将任何html内容集中在浏览器的中心？

html browser

如何将任何html内容集中在浏览器的中心？,html,browser,center,Html,Browser,Center,我是许多html代码概念的新手，对html内容的中心化有疑问关于html代码，如何最好地将任何内容集中在webbrowser的中心我特别需要在C#webBrowser控件中执行此操作，并且想知道是否需要向html代码添加一些样式、添加一些属性、添加特定容器，或者是否有其他方法我需要水平和垂直居中谢谢。要水平居中： left: 50%; transform: translateX(-50%); 工作。要垂直居中： position: absolute; t

我是许多html代码概念的新手，对html内容的中心化有疑问

关于html代码，如何最好地将任何内容集中在webbrowser的中心

我特别需要在C#webBrowser控件中执行此操作，并且想知道是否需要向html代码添加一些样式、添加一些属性、添加特定容器，或者是否有其他方法

我需要水平和垂直居中

谢谢。

要水平居中：

    left: 50%;
    transform: translateX(-50%);

工作。要垂直居中：

    position: absolute;
    top: 50%;
    transform: translateY(-50%);

.outer{
显示：表格；
位置：绝对位置；
身高：100%；
宽度：100%；
}
.中{
文本对齐：居中；
显示：表格单元格；
垂直对齐：中间对齐；
}
.内部{
保证金：自动；
背景色：#ddd；
宽度：30%/*任意宽度*；
}


内容
我内心的内容

您必须为容器指定一个固定高度，并添加与行高相同的高度，然后将内容添加到另一个容器中，并将其放置在主容器中

请尝试以下代码

<!DOCTYPE html>
<html>
<style>
.content{
    text-align: center; 
    height:800px;
    line-height: 800px;
}
.inner-content {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;      
}
</style>
<body>
    <div class="content"><span class="inner-content">test content<br>test content<br>test content<br>test content<br>test content<br>test content<br>test content<br>test content<br>test content<br>test content<br></span></div>
</body>
</html>


.内容{
文本对齐：居中；
高度：800px；
线高：800px；
}
.内在内容{
显示：内联块；
垂直对齐：中间对齐；
线高：正常；
}
试验内容
试验内容
试验内容
试验内容
试验内容
试验内容
试验内容
试验内容
试验内容
试验内容
试验内容

请尝试以下方法：

Css:

垂直居中代码起作用，但水平方向不起作用。你输入错误了吗？我编辑了我的代码，使它现在可以工作了。我忘了那个位置：绝对，所以边距：自动不起作用。很抱歉。

.first {
    display: table;
    position: absolute;
    height: 100%;
    width: 100%;
}

.Second {
    text-align: center;
    display: table-cell;
    vertical-align: middle;
}

.third {
    margin: auto; 
    background-color: #cb1c69;
    width: 100%/*whatever width you want*/;
}
.center
{
    text-align:center;
    color:white;
}
.cen
{
    text-align:center;
    color:white;
}