求助：如何创建带有红色阴影的指定样式按钮

Got it! Let's turn that Google Drive link into a polished button with a red shadow. You'll just need a mix of HTML for the link structure and CSS to add the styling. Here's a straightforward, ready-to-use implementation:

<p>
  <a href="https://drive.google.com/open?id=1yOkIr0uu6iqwjin2_H00K7gkP_f7g1_r" rel="nofollow noreferrer" class="red-shadow-btn">
    Open Google Drive File
  </a>
</p>

<style>
.red-shadow-btn {
  /* Core button styling */
  display: inline-block;
  padding: 10px 22px;
  background-color: #fff;
  color: #333;
  text-decoration: none;
  border-radius: 6px;
  border: 1px solid #ddd;
  font-family: system-ui, Arial, sans-serif;
  font-size: 14px;
  
  /* Red shadow effect (the key part!) */
  box-shadow: 0 3px 10px rgba(255, 0, 0, 0.3);
  
  /* Smooth hover transition for interactivity */
  transition: all 0.2s ease-in-out;
}

.red-shadow-btn:hover {
  box-shadow: 0 5px 15px rgba(255, 0, 0, 0.4);
  background-color: #f9f9f9;
}
</style>

Quick notes on customizing: #

• Adjust the box-shadow values to tweak the shadow's size, blur, or intensity. For example, 0 2px 6px rgba(255, 0, 0, 0.2) would make a softer, smaller shadow.
• If you want a solid red button instead of white, swap background-color: #fff for background-color: #dc3545 and change color: #333 to color: #fff.
• The hover effect adds a subtle interactive boost, but you can remove it by deleting the .red-shadow-btn:hover block if you don't need it.

内容的提问来源于stack exchange，提问作者Jaloliddin Bieber