css+线条从左到右 |css点击出现小手

.left-to-right {
display: flex;
justify-content: flex-start;
align-items: center;
width: 100%;
height: 2px;
background-color: #000000;
}
.line {
width: 50%;
height: 100%;
background-color: #ffffff;
}

首先，大家创建一个容器元素并将其定义为flex布局并使用justify-content和align-items属性来水平和垂直居中。然后设置线条的宽度和高度，以及背景色为黑色。接下来，大家再创建一个线条，将其宽度设置为容器的50%，将其高度设置为容器的高度，并将其背景色设置为白色。在这个例子中，大家使用了CSS的flex布局来实现从左到右的效果，同时使用了两种不同的颜色来强调线条的位置。

通过这种方法，大家可以轻松地创建一个从左到右的线条效果。无论你是要设计一个网站界面，还是要创建一个简单的HTML页面，这个技巧都可以让你的网页布局更加清晰和美观。所以，让大家开始在自己的网页设计项目中应用这个技巧吧！