css -- "闪亮的文本竖线"

html-css011

css -- "闪亮的文本竖线",第1张

聚焦有时候会出现一闪一闪的黑色竖线,在css当中有此属性 caret-color

当我们想要改变竖线的颜色的时候,只需要输入颜色的指即可

当我们不想要这个竖线的时候,只需要输入 caret-color: rgba(0, 0, 0, 0)

总结如下

用一个div设置他的高度,width等于1,用border、background都可以给它设置颜色,它就是一条直线了。

具体实现方法操作如下:

工具原料:编辑器、浏览器;

方法1、可以给一个一定宽度的元素设置一个border-bottom属性,让其只有一个底边框,进而实现一条线的效果,代码如下:

<div id="div1">             </div><style>    #div1{    margin-top: 100px    width: 900px    border-bottom: 1px solid #000000    }

</style>

方法2、使用hr标签实现画一条线,代码如下:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>float</title>

</head>

<div id="div1"></div>

<style>

#div1{

width: 500px

border-bottom: 1px solid red

}

</style>

 </html>