最新檢視版面css無名樣式分享區

以下是一個簡單的示例,展示了一個分享區的CSS樣式。請注意,這只是一個基本的示例,您可以根據自己的需求進行修改和擴展。

/* 分享區樣式 */
.share-area {
  /* 背景顏色和框線 */
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  padding: 20px;
  margin-bottom: 20px;
}

.share-area h3 {
  /* 標題樣式 */
  font-size: 18px;
  margin-top: 0;
}

.share-area p {
  /* 內容樣式 */
  margin-top: 10px;
  line-height: 1.5;
}

/* 分享按鈕樣式 */
.share-btn {
  /* 背景顏色和框線 */
  background-color: #3498db; /* 藍色 */
  color: #fff; /* 文字顏色 */
  border: none; /* 無框線 */
  padding: 10px 20px; /* 內邊距 */
  border-radius: 5px; /* 圓角 */
  font-size: 16px; /* 字型大小 */
  cursor: pointer; /* 滑鼠懸停時變為手形 */
}

要使用上述樣式,您可以將 .share-area 類套用於包含分享區域的 HTML 元素,並使用 .share-btn 類套用於分享按鈕元素。確保將樣式代碼放在一個單獨的 CSS 檔案中,並將其連結到您的網頁中。

請注意,這只是一個基本的示例,您可以根據自己的需求進行進一步的樣式調整和擴展。您可以根據需要添加其他類來定義其他元素的樣式,或者使用媒體查詢來針對不同的螢幕尺寸套用不同的樣式。