更新盒子模型练习/盒子模型练习.html, 盒子模型练习/img/背景1.jpg, 盒子模型练习/img/图标.jpg

710d338e · 媽呀 · 710d338e · 710d338e · 710d338e
3 changed file
--- a/盒子模型练习/img/图标.jpg
+++ b/盒子模型练习/img/图标.jpg
--- a/盒子模型练习/img/背景1.jpg
+++ b/盒子模型练习/img/背景1.jpg
--- a/盒子模型练习/盒子模型练习.html
+++ b/盒子模型练习/盒子模型练习.html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Title</title>
+    <style type="text/css">
+        *{
+            margin: 0;
+            padding: 0;
+        }
+        .box{
+            width: 298px;
+            height: 226px;
+            border: #cccccc 1px solid;
+            background: url("img/背景1.jpg");
+            padding: 0 15px;
+            margin: 100px auto;
+        }
+        .new{
+            width:298px ;
+            height: 26px;
+            border-bottom: #cccccc 1px solid;
+            font-size: 18px;
+            padding-top: 17px;
+            line-height: 26px;
+            font-weight: bolder;
+        }
+        .d1{
+            padding-top: 13px;
+            background: url("img/图标.jpg") 5px 21px no-repeat;
+        }
+        .d2{
+            padding-top: 3px;
+            background: url("img/图标.jpg") 5px 12px no-repeat;
+        }
+        .d{
+            width: 278px;
+            height: 27px;
+            border-bottom: #cccccc 1px dashed;
+            font-size: 10px;
+            line-height: 27px;
+            padding-left: 20px;
+        }
+        a{
+            text-decoration: none;
+            color: black;
+        }
+    </style>
+</head>
+<body>
+<div class="box">
+    <div class="new">最新文章/New Articles</div>
+    <div class="d d1"><a href="">北京招聘网页设计，平面设计，php</a></div>
+    <div class="d d2"><a href="">体验javascript的魅力</a></div>
+    <div class="d d2"><a href="">jquery世界来临</a></div>
+    <div class="d d2"><a href="">网页设计师的梦想</a></div>
+    <div class="d d2"><a href="">jquery中的链式编程是什么</a></div>
+</div>
+</body>
+</html>