diff --git a/Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/css/index.css b/Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/css/index.css index 40e9821..270c379 100644 --- a/Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/css/index.css +++ b/Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/css/index.css @@ -1,18 +1,44 @@ -form { - text-align: center; +body { + display: flex; + align-items: center; + justify-content: center; + align-content: center; } -/* select { - width: 150px; -} */ - select { - background: #fafdfe; + /* background: #fafdfe; */ + background: transparent; height: 28px; width: 180px; line-height: 28px; border: 1px solid #9bc0dd; -moz-border-radius: 2px; -webkit-border-radius: 2px; - border-radius: 2px; + border-radius: 50px; + border-color: #54b5a6; + outline-color: #ebadb6; + /* color: rgb(2, 60, 29); */ + margin-top: 10px; } + +.form { + width: 180px; + display: flex; + flex-direction: row; + align-items: center; + flex-wrap: wrap; + justify-content: flex-start; + text-align: center; +} + +.card { + width: 250px; + height: 254px; + background: linear-gradient(135deg, #ebadb6 0%, #aceae1 100%); + border-radius: 7px; + box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #ffffff; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + } \ No newline at end of file diff --git a/Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/index.html b/Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/index.html index d4215bb..7c9d19f 100644 --- a/Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/index.html +++ b/Html-practice/Ajax/基于jQuery的AJAX实现三级联动菜单/index.html @@ -12,19 +12,27 @@ -
-
- 省份： -    城市： -    地区： - -
+
+ +
+ +
+ 省 份: + + 城 市: + + 地 区: + +
+ +
+