Angular4导航-选项卡样式不起作用

是一个常见的问题，可能是由于以下几个原因导致的：

1. CSS样式问题：首先，检查你的CSS样式是否正确引入，并且是否应用到了选项卡组件上。可以通过浏览器的开发者工具检查元素的样式是否正确应用。
2. 组件选择器问题：确保你的选项卡组件的选择器与HTML模板中的标签匹配。如果选择器不正确，组件将无法正确渲染。
3. 样式优先级问题：如果你的选项卡样式被其他样式覆盖，可以尝试增加样式的优先级。可以使用!important关键字或者更具体的CSS选择器来提高样式的优先级。
4. Angular生命周期钩子问题：如果你的选项卡样式在组件初始化时没有生效，可能是因为样式被应用在了组件初始化之前。可以尝试将样式应用到ngAfterViewInit生命周期钩子中，确保组件已经完全初始化。
5. 第三方库冲突问题：如果你在项目中使用了第三方库，可能会导致样式冲突。可以尝试禁用或调整第三方库的样式，或者使用更具体的CSS选择器来覆盖第三方库的样式。

对于Angular4导航-选项卡样式不起作用的解决方案，可以参考以下步骤：

1. 确保你的CSS样式正确引入，并且应用到了选项卡组件上。
2. 检查选项卡组件的选择器是否与HTML模板中的标签匹配。
3. 尝试增加样式的优先级，可以使用!important关键字或者更具体的CSS选择器。
4. 确保样式应用在了组件完全初始化之后，可以使用ngAfterViewInit生命周期钩子。

如果以上步骤都没有解决问题，可以进一步检查是否存在第三方库的样式冲突，并尝试调整或禁用第三方库的样式。

腾讯云相关产品推荐：

• 云服务器（CVM）：提供弹性计算能力，满足各种规模的应用需求。产品介绍链接：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL版（CDB）：提供高性能、可扩展的关系型数据库服务。产品介绍链接：https://cloud.tencent.com/product/cdb
• 云存储（COS）：提供安全、稳定、低成本的对象存储服务，适用于各种场景的数据存储和处理。产品介绍链接：https://cloud.tencent.com/product/cos
• 人工智能机器学习平台（AI Lab）：提供丰富的人工智能算法和模型，帮助开发者快速构建和部署AI应用。产品介绍链接：https://cloud.tencent.com/product/ailab

请注意，以上推荐的腾讯云产品仅供参考，具体选择应根据实际需求进行评估和决策。