`

2、从零开始写一个webDesktop

 
阅读更多

第二步:壁纸,任务栏增加开始按钮

第一步:设置壁纸,设置的CSS如下:

#wallpaper {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

 Html如下:

<body>
	<img id="wallpaper" src="images/wallpaper.jpg" />
	<div id="content">
		<div id="bottom">
  		</div>
	</div>
</body>

 增加红色那块内容,效果如下:



 

第二步:增加开始菜单

随便找了一个开始菜单的图标,按钮CSS如下:

#start {
  position: absolute !important;
  color: #fff;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -webkit-background-clip: padding-box;
  overflow: hidden;
  padding: 0 10px;
  height: 30px;
  margin: 0 0 10px 5px;
}

#start:hover{
  background: #fff;
}

#start:active {
  background: #555;
  border: 2px solid #fff;
  padding: 0 9px;
}

#start img {
  display: block;
  padding: 2px 0 0;
  width:26px;
  height:26px;
}

 添加Html代码

<body>
	<img id="wallpaper" src="images/wallpaper.jpg" />
	<div id="content">
		<div id="bottom">
			<a id="start" title="开始">
	      		<img src="images/start.png" />
			</a>
  		</div>
	</div>
</body>

 添加红色这段,显示效果如下:



 ,明天任务栏分块,左边开始菜单,中间各种任务,右边copyright吧。

  • 大小: 738 KB
  • 大小: 736.7 KB
分享到:
评论

相关推荐

    ArcGIS Desktop轻松入门

    **ArcGIS Desktop 轻松入门...通过这个详细的中文教程,你将能够从零开始,逐步掌握ArcGIS Desktop的基本操作,实现地图的创建、数据的管理和分析,以及地理信息的可视化。不断实践和探索,你将在GIS的世界中游刃有余。

    java开源包11

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    tableau desktop 10.5 帮助(中文文档 用户指南 技术参考手册)

    这些内容旨在帮助用户从零开始学习Tableau,对于不熟悉Tableau的用户来说,这是最佳的学习起点。 接下来,文档提及了多个Tableau工作区的组成部分,比如连接、设置、管理、构建视图等。在连接部分,介绍了如何连接...

    java开源包2

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    Python库 | setux_desktop-0.21.20.3-py3-none-any.whl

    使用这样的库可以避免从零开始编写底层代码,而专注于应用的核心逻辑。 安装这个库非常简单,只需要拥有Python环境和pip(Python的包管理器)即可。在命令行中,用户可以使用 `pip install setux_desktop-0.21.20.3...

    java开源包1

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包3

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包6

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包5

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包10

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包4

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包8

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包7

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包9

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    java开源包101

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    Java资源包01

    BlueLeech是一个开源程序,它从指定的URL开始,搜索所有可用的链接,以及链接之上的链接。它在搜索的同时可以下载遇到的链接所指向的所有的或预定义的范围的内容。 WebSocket协议的Java实现 WebSocket4J WebSocket4...

    Another

    在编程中,类库是一组预先编写好的函数或类,程序员可以使用它们来构建应用程序,而不是从零开始编写所有代码。这里的"Another CLASS类库"很可能包含了一系列与文件操作相关的类,如打开、读取、写入和遍历目录等...

    从零学python系列之教你如何根据图片生成字符画.docx

    2. **安装PIL库**:PIL(Python Imaging Library)是Python的一个用于处理图像的库,可以通过以下命令安装: ```bash pip install pillow ``` #### 三、原理介绍 生成字符画的过程可以分为以下几个步骤: 1. **...

    arcgis1:5万符号库.rar

    有了这个符号库,地图制图者可以极大地提高工作效率,无需从零开始设计每个符号,只需在预设的库中挑选即可。同时,由于这些符号遵循了地图制图的规范和标准,因此制出的地图具有高度的可读性和专业性。 在实际应用...

    Rapid SCADA示例:Modbus和MQTT

    【Rapid SCADA示例:Modbus和MQTT】是一个详细的教程,旨在引导用户通过从零开始设置一个基于Rapid SCADA 6的系统,该系统能够与Modbus TCP通信并发布数据到MQTT服务器。这个过程涵盖了从安装IIS(Internet ...

Global site tag (gtag.js) - Google Analytics