IE 지원종료에 따른 안내문 추가 방법

1. Graha 응용프로그램에서

_base.xml 파일에 다음과 같은 사항을 추가한다.

<style name="warningIE">
div#warningIE {
    display:none;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    div#warningIE {
        display:block;
        width:100%;
        background-color:#FF0000;
        text-align:center;
        padding:10px 0px 10px 0px;
        color:#FFFFFF;
        font-weight:600;
        margin-bottom:10px;
    }
}
        </style>
        <style name="warningIE2" only="ie">
div#warningIE {
    display:block;
    width:100%;
    background-color:#FF0000;
    text-align:center;
    padding:10px 0px 10px 0px;
    color:#FFFFFF;
    font-weight:600;
    margin-bottom:10px;
}
        </style>
        <top><![CDATA[
<div id="warningIE">
Microsoft 社는 2022년 6월 15일 Internet Explorer 11의 지원을 종료했습니다.
</div>
        ]]></top>

<top> 요소는 여러 개를 정의할 수 있고, 순서대로 출력되므로, _base.xml 에 다른 <top> 요소가 정의되어 있는 경우, 가장 위쪽에 위치하도록 한다.

2. 일반적으로

head 사이에 다음과 같은 내용을 추가한다.

<style>
div#warningIE {
    display:none;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    div#warningIE {
        display:block;
        width:100%;
        background-color:#FF0000;
        text-align:center;
        padding:10px 0px 10px 0px;
        color:#FFFFFF;
        font-weight:600;
        margin-bottom:10px;
    }
}
        </style>
<!--[if IE]>
<style>
div#warningIE {
    display:block;
    width:100%;
    background-color:#FF0000;
    text-align:center;
    padding:10px 0px 10px 0px;
    color:#FFFFFF;
    font-weight:600;
    margin-bottom:10px;
}
</style>
<![endif]-->

body 태그 바로 뒤에 다음과 같은 내용을 추가한다.

<div id="warningIE">
Microsoft 社는 2022년 6월 15일 Internet Explorer 11의 지원을 종료했습니다.
</div>