CSS 圖形提交按鈕是網頁設計中非常實用的一種元素，它可以讓用戶在提交表單時有更好的操作體驗。下面我們來學習如何使用 CSS 來實現一個簡單的提交按鈕。

.button {
background-color: #4CAF50; /* 按鈕默認顏色 */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 4px;
}
/* 按鈕懸停效果 */
.button:hover {
background-color: #3e8e41;
}
/* 按鈕點擊效果 */
.button:active {
background-color: #4CAF50;
box-shadow: 0 5px #666;
transform: translateY(4px);
}

代碼中首先定義了按鈕的基本樣式，包括背景顏色、邊框、字體顏色和大小等等。接下來定義了按鈕懸浮時的顏色和點擊時的效果，包括背景顏色的改變、陰影效果和向下移動的動畫效果。

上述代碼可以實現一個簡單的提交按鈕，但如果你想讓按鈕更加具有視覺效果，你可以在按鈕上加入一些圖形元素。

button:after {
content: "";
background: url(images/arrow.svg) no-repeat center center;
width: 24px;
height: 24px;
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
}
/* 懸浮狀態下的箭頭 */
.button:hover:after {
transform: translateY(-50%) rotate(180deg);
}

以上代碼可以在按鈕上添加一個箭頭圖形元素，當鼠標懸停在按鈕上時，箭頭會旋轉 180 度。你可以通過修改箭頭的寬度、高度、位置和變換方式等屬性，來實現不同的效果。

上述代碼就是一個簡單的 CSS 圖形提交按鈕的實現過程，希望對你有所幫助！