純CSS制作網站工具按照實現功能可分為兩類：布局工具和美化工具。布局工具主要用于快速定位HTML元素的位置，一般通過CSS選擇器和屬性實現。美化工具則主要用于實現網頁的視覺效果，如顏色、字體、形狀等。

布局工具比較常用的有Flexbox和Grid。Flexbox通過設置容器和元素的屬性，實現自適應布局，支持垂直和水平方向上的布局；Grid則是二維網格布局，可以將網頁分成多個網格，靈活變換位置和大小。

美化工具比較常用的有字體、顏色、陰影、邊框、動畫等。通過設置元素的各種屬性，可以實現各種效果。比如設置文本陰影和背景色，可以讓文本更加突出；設置邊框和圓角，可以讓元素更有層次感；設置動畫，可以讓頁面更加生動。

/*使用Flexbox實現自適應布局*/
.container{
	display: flex;
	flex-wrap: wrap; /*有多個元素時自動換行*/
	justify-content: center; /*水平中心對齊*/
	align-items: center; /*垂直居中對齊*/
}
.item{
	flex-basis: 200px; /*基礎大小*/
	flex-grow: 1; /*自動填充剩余空間*/
	margin: 10px; /*外邊距*/
}
/*使用動畫實現頁面效果*/
.btn{
	background-color: #fff;
	color: #333;
	border: 2px solid #333;
	border-radius: 20px;
	padding: 10px 20px;
	cursor: pointer;
	animation: pulse 1s ease-in-out infinite alternate;
}
@keyframes pulse{
	from{
transform: scale(1);
	}
	to{
transform: scale(1.2);
	}
}

以上就是純CSS制作網站工具的一些示例，當然還有許多其他的工具和屬性可以使用，需要根據具體情況選擇合適的方法。在使用CSS制作網頁時，可以通過開發者工具和示例代碼學習和借鑒，不斷提高自己的技能水平。