CSS如何修剪鼠标滚动区域？

我有一些来自现有CSS地图的代码，下面的部分令人困惑，因为我认为它与使一个简单的BOX更加定义翻转区域（california1）有关。CSS如何修剪鼠标滚动区域？

我的问题：如何自己写这个，为什么使用em而不是像素？

示例代码：

#california1 .s1{height:.3em;left:14em;top:12.7em;width:.2em} 
#california1 .s2{height:.5em;left:13.8em;top:12.6em;width:.2em} 
#california1 .s3{height:.7em;left:13.7em;top:12.5em;width:.1em} 
#california1 .s4{height:.8em;left:13.6em;top:12.4em;width:.1em} 
#california1 .s5{height:.9em;left:13.5em;top:12.3em;width:.1em} 
#california1 .s6{height:1em;left:13.4em;top:12.2em;width:.1em}

来源

2011-05-26 chris

em是相对的，px不是。 – 2011-05-26 14:58:30

所以要回答你的第一个问题，写这个自己将是相当简单 - 我查看此出HTML的背景下，但我猜测每个那些“ .s1，.s2等“divs只是地图的”片段“。

新兴用来经文像素，因为调整时一个窗口，或在手机浏览器中查看网站等

来源

2011-05-26 15:15:36 briankulp

谢谢。将使用什么软件来绘制这些单元？ – chris 2011-05-26 17:33:20

em是相对于font-size属性，将规模比像素更好。 1em等于当前元素font-size。

如果您正在处理静态图片，请尝试增加浏览器的文字大小，并查看您的细分受众群将会增长，而不再适合地图。

你的意思是你希望它更加明确，我希望你用map和areaHTML elements来定义可点击的部分。使用面积poly形状坐标来确定最佳加州的各个部分：

<map name="california"> 
    <area shape="poly" coords="x1,y1,x2,y2,... xn,yn" href="s1.html" alt="segment 1"> 
    <area shape="poly" coords="..." href="s2.html" alt="segment 2"> 
    ... 
    <area shape="poly" coords="..." href="sn.html" alt="segment n"> 
</map>

然后将其与usemap分配给你的形象：

<image usemap="#california" ... />

Here你有一个例子。

我不知道它是否太明显，我只是希望它有帮助。

来源

2011-05-26 16:03:28

谢谢。我正在使用类似于winstonwolf.pl/css,europe.html的CSS映射我已经编码了一切，但是为定义/测量形状定义的EM而丢失了。 – chris 2011-05-26 20:59:49

不要将em用于静态图像中的形状，请使用像素。借助Dreamweaver，定义地图区域非常容易，但对于您所尝试的内容，您必须自行计算 – 2011-05-27 07:35:36

CSS如何修剪鼠标滚动区域？

回答

相关问题