使用css实现等间距刻度线效果

html-css011

使用css实现等间距刻度线效果,第1张

background-image: repeating-linear-gradient(to right, rgba(255, 255, 255, 0),rgba(249, 249, 249, 0) 4px,#000 4px ,#000 8px)

width: 200px

height: 20px

刚手写的，希望是你要的效果；可以兼容不同浏览器的水平和垂直居中

<body style="margin:0padding:0">

<div style="height:1pxbackground-color:#000position:absolutetop:50%left:0pxwidth:100%"></div>

<div style=" background-color:#000position:absolutetop:50%left:50%width:200pxheight:100pxmargin:-50px 0 0 -100pxbackground-color:#00FFCC">插入图片</div>

</body>

如果你要做的是一个页面的某一部分的话，那就调整top的值，设为固定值就行了