Так что я довольно новый с Sharepoint, но я достаточно опытен с HTML и CSS. В настоящее время я сделал это мини-приложение html для изменения некоторых изображений гиперссылок при наведении, и он отлично работает, если я запускаю его в обычном браузере/вне sharepoint.Microsoft Sharepoint добавляет «внешний класс» к моему CSS после сохранения богатого поля
Теперь проблема заключается в следующем: я перехожу в sharepoint, и я пишу свой код в богатом поле (которое дает мне возможность встраивать html в него), и оно не работает. Он работал бы в «режиме редактирования», но не после его сохранения. Кроме того, после сохранения кода HTML он генерирует что-то под названием «Внешний класс» рядом с каждым из моих объектов CSS, как показано ниже. Это причина, по которой мой код не работает после сохранения? Что делает sharepoint для моего HTML-кода? Есть ли способ исправить это? Я был бы признателен за помощь в этом вопросе.
Оригинал:
<style type="text/css">
#map
{
width:663px;
height:715px;
background-image:url("/sites/00172/SiteAssets/Germany1-Standard.png");
}
#Bremen
{
position:absolute;
width:37px;
height:53px;
top:359px;
left:243px;
background-image:none;
}
#Berlin
{
position:absolute;
width:35px;
height:55px;
top:393px;
left:550px;
\t \t \t background-image:none;
}
#Coburg
{
position:absolute;
width:41px;
height:54px;
top:605px;
left:382px;
\t \t \t background-image:none;
}
#Hallstadt-Bamberg
{
position:absolute;
width:43px;
height:51px;
top:659px;
left:368px;
background-image:none;
}
#Bremen:hover
\t \t {
\t \t \t background-image:url("/sites/00172/SiteAssets/Germany1-Bremen.png");
\t \t }
\t \t
\t \t #Berlin:hover
\t \t {
\t \t \t background-image:url("/sites/00172/SiteAssets/Germany1-Berlin.png");
\t \t }
\t \t
\t \t #Coburg:hover
\t \t {
\t \t \t background-image:url("/sites/00172/SiteAssets/Germany1-Coburg.png");
\t \t }
\t \t
\t \t #Hallstadt-Bamberg:hover
\t \t {
\t \t \t background-image:url("/sites/00172/SiteAssets/Germany1-Hallstadt.png");
\t \t }
</style> <div id="map">
<a href="/sites/00172/Lists/Calendar01/calendar.aspx" title="Bremen" id="Bremen">
<a href="/sites/00172/Lists/Calendar02/calendar.aspx" title="Berlin" id="Berlin">
<a href="/sites/00172/Lists/Calender03/calendar.aspx" title="Coburg" id="Coburg">
<a href="/sites/00172/Lists/Calendar04/calendar.aspx" title="Hallstadt-Bamberg" id="Hallstadt-Bamberg">
</div>После сохранения в Sharepoint:
<style unselectable="on">
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #map {
width:663px;
height:715px;
}
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #Bremen {
position:absolute;
width:37px;
height:53px;
top:83px;
left:209px;
}
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #Berlin {
position:absolute;
width:35px;
height:55px;
top:118px;
left:516px;
}
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #Coburg {
position:absolute;
width:41px;
height:54px;
top:605px;
left:382px;
}
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #Hallstadt-Bamberg {
position:absolute;
width:43px;
height:51px;
top:209px;
left:83px;
}
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #Bremen:hover {
}
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #Berlin:hover {
}
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #Coburg:hover {
}
AFC97320FBA74F4E88F2B1AD1F833E02 .ExternalClass #Hallstadt-Bamberg:hover {
}
</style>
<div id="map" unselectable="on">
<a title="Bremen" id="Bremen" href="/sites/00172/Lists/Calendar01/calendar.aspx" unselectable="on">
</a><a title="Berlin" id="Berlin" href="/sites/00172/Lists/Calendar02/calendar.aspx" unselectable="on">
</a><a title="Coburg" id="Coburg" href="/sites/00172/Lists/Calendar03/calendar.aspx" unselectable="on">
</a><a title="Hallstadt-Bamberg" id="Hallstadt-Bamberg" href="/sites/00172/Lists/Calendar04/calendar.aspx" unselectable="on">
</a></div>