CSS outline 焦点状态示例

<html>
  <head>
    <meta charset="utf-8">
    <title>CSS outline 焦点状态示例</title>
    <style>
      /* 输入框焦点样式 */
      .input-focus {
        padding: 10px;
        border: 2px solid #ccc;
        font-size: 16px;
        width: 250px;
      }
      
      .input-focus:focus {
        outline: 3px solid #0066ff;
        outline-offset: 2px;
        border-color: #0066ff;
      }
      
      /* 按钮焦点样式 */
      .btn-focus {
        padding: 12px 24px;
        background-color: #0066ff;
        color: white;
        border: none;