当前位置:嗨网首页>书籍在线阅读

19-更新样式表

  
选择背景色: 黄橙 洋红 淡粉 水蓝 草绿 白色 选择字体: 宋体 黑体 微软雅黑 楷体 选择字体大小: 恢复默认

6.4.2 更新样式表

现在我们将更新样式表,以便满足改进后的界面。首先我们希望更新根样式表,阻止选择绝大多数元素上的文字。这会解决一个很恼人的用户体验问题,在触摸设备上尤其明显。更新如代码清单6-13所示。更改部分以粗体显示。

代码清单6-13 更新根样式表——spa/css/spa.css

figure_0223_0299.jpg figure_0224_0300.jpg 现在我们需要更新Chat样式表。主要更改包括以下几项。

给在线人员列表添加样式,使之显示在滑块的左边。

加大滑块的宽度,以适应人员列表。

给消息窗口添加样式。

移除所有的spa-chat-box和spa-chat-msgs的选择器。

给接收自用户、听者和系统的消息添加样式。

上述更新如代码清单6-14所示。更改部分以粗体显示。

代码清单6-14 更新Chat 的样式表——spa/css/spa.chat.css

figure_0224_0301.jpg figure_0225_0302.jpg figure_0226_0303.jpg figure_0227_0304.jpg 现在已经有了样式表,我们来看一下更新后的Chat UI是多么漂亮。