SharePoint Online 开发：定义CSS元素

Blog链接：https://blog.51cto.com/13969817

之前的blog分享的都是针对现有的CSS元素进行更改，一直都是在重新定义它们，使他们满足我们的需求，也许有些人会问为什么我们不直接创建新CSS元素，然后按照我们想要的方式定义它们，再使用它们呢？
你可以这样操作，但并不是你想象的那么简单，在SharePoint站点上的HTML中代码是相当复杂的，有多个被调用的CSS表和多个元素类，它们可能都在一些地方被包装成一个单独的ID，这是一个复杂的网，如果修改现有的CSS，你只是在改变它的行为方式，则不会更改任何底层结构。
如果Microsoft对代码进行了更改，它们通常会重用元素名称，这意味着你自定义的CSS很有可能被保留，如果你创建自定义母版页时对站点的底层HTML进行了更改，有可能再下一次升级时它会失败或者阻止升级部署。
你只是在改变它的行为方式。如果Microsoft对代码进行了更改，它们通常会重用元素名称，这意味着您的自定义CSS定义很有可能被保留。如果你在创建自定义母版页时那样对站点的底层HTML进行更改，我几乎可以保证下一次升级时它将失败，或者阻止升级部署，这意味着要么停留在现在发行的SharePoint版本，而错过新版本的New Feature，要么需要更多的开发和维护时间。

但如果你想通过CSS更改网站一些外观也是可以的，比如你想定期通过网站的一个页面发布新闻，并且想保持所有页面外观一致，需求：

• 发布新闻，归档旧的新闻
• 一致的页面外观：需要两层标题；需要一些内容文本；需要项目符号列表；超链接上没有下划线

这些可以用CSS来说设置这些代码，我们来回到样式表，如下：

示例代码：

.newheader1 {/这是新闻的主标题 /
font-size: x-large !important;
font-weight: bold !important;
color: darkred !important;
}

.newheader2 {/这是新闻的二级主标题 /
font-size: large !important;
color: darkred !important;
}

.newscontent {/这是内容文本/
font-family:"Times New Foman",Georgia,Serif;
}

Newhead1和2分别对应两个标题的设置，Newscontent是新闻内容的相关设置，示例代码仅供参考。