HTML <samp> 태그

<p>
    프로그램 실행 결과: <samp>Hello, World!</samp>
</p>

<p>
    시스템 메시지: <samp>Error: File not found</samp>
</p>

<!-- 1. 코드 실행 결과 -->
<article class="code-output">
    <h2>Python 코드 실행 결과</h2>
    <pre>
        <code>print("안녕하세요!")</code>
        <samp>안녕하세요!</samp>
    </pre>
</article>

<!-- 2. 시스템 메시지 -->
<article class="system-messages">
    <h2>일반적인 오류 메시지</h2>
    <ul>
        <li>404 오류: <samp>Page Not Found</samp></li>
        <li>500 오류: <samp>Internal Server Error</samp></li>
        <li>권한 오류: <samp>Access Denied</samp></li>
    </ul>
</article>

<!-- 3. 스타일링 예제 -->
<style>
.samp-custom {
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 3px;
    color: #333;
    display: inline-block;
    font-family: monospace;
    padding: 2px 4px;
}

.code-output samp {
    color: #2196f3;
    font-weight: 500;
}

.system-messages samp {
    color: #e91e63;
    background-color: #fce4ec;
    padding: 2px 6px;
    border-radius: 3px;
}
</style>

<p>
    명령어 실행: <samp class="samp-custom">$ npm install</samp>
</p>