问HTML或CSS，这是怎么做到的？
EN

Stack Overflow用户

提问于 2013-01-14 22:57:08

回答 1查看 90关注 0票数 1

我发现了一个网站，有人只使用css和html来制作Windows7的开始菜单。此外，我还注意到搜索栏中有一个放大镜。

我的问题是，这个人是如何获得字符/符号的，因为我在网上找不到任何放大镜，我假设他没有为这个菜单提供任何图像。

这是指向site的链接

如果有人太懒，这里是网站的图片，但如果没有来源，你可能找不到它是什么，所以请访问site。

html

css

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-01-14 23:00:13

他使用<form>上的::before和::after绘制了一个圆和一条旋转线。

你可以在Chrome的检查器中看到它：

#menu .left-menu form#search::before {
    content: "";
    width: 3px;
    height: 0px;
    border: 1px solid #666;
    position: absolute;
    z-index: 3;
    left: 100%;
    margin-left: -41px;
    top: 23px;
    -webkit-transform: rotate(-41deg);
    -moz-transform: rotate(-41deg);
    -ms-transform: rotate(-41deg);
    -o-transform: rotate(-41deg);
    transform: rotate(-41deg);

}

#menu .left-menu form#search::after {
    content: "";
    width: 5px;
    height: 5px;
    border: 1px solid #666;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    position: absolute;
    left: 100%;
    margin-left: -37px;
    top: 16px;

}

票数 5

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/14320807

复制

相似问题

问HTML或CSS，这是怎么做到的？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML或CSS，这是怎么做到的？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML或CSS，这是怎么做到的？
EN