写html和css怎么分屏,如何使用CSS创建分屏（50/50）？

要使用CSS创建拆分屏幕，代码如下-

示例html>

body {

font-family: Arial;

color: white;

}

h1{

padding:20px;

}

.left,.right {

height: 100%;

width: 50%;

position: fixed;

z-index: 1;

top: 0;

overflow-x: hidden;

padding-top: 20px;

}

.left {

left: 0;

background-color: rgb(36, 0, 95);

}

.right {

right: 0;

background-color: rgb(56, 1, 44);

}

.centered {

position: absolute;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

text-align: center;

}

.centered img {

width: 150px;

border-radius: 50%;

}

Some random text on the left

Some random text on the right

输出结果

上面的代码将产生以下输出-