feng-luo - 博客园

2026年7月9日

摘要：信息登陆页面 <body> <form action="" method="post"> <div> <h1>个人信息</h1> </div> <div> <label>头像：<input type="file" name="pic"></label> </div> <div> <label>个人说阅读全文

posted @ 2026-07-09 21:12 feng-luo 阅读(6) 评论(0) 推荐(0)

2026年6月28日

17周利用border-radius制作圆

摘要：利用border-radius制作圆 html <body> <div class="circle"> 1 </div> </body> css .circle{ margin: 0 auto; width: 100px; height: 100px; background-color: red; 阅读全文

posted @ 2026-06-28 22:40 feng-luo 阅读(5) 评论(0) 推荐(0)

16周弹性盒子布局

摘要：弹性盒子布局 html <body> <h1>flex-start</h1> <div class="container1"> <div class="item1"></div> <div class="item2"></div> <div class="item3"></div> </div> < 阅读全文

posted @ 2026-06-28 22:40 feng-luo 阅读(3) 评论(0) 推荐(0)

2026年6月17日

15周图文卡片布局

摘要：图文卡片布局 <div class="box1">  <div class="img1">  <img src="./img/icon3.jpg" alt="" /> </div> <div class="txt">  <h2 阅读全文

posted @ 2026-06-17 07:57 feng-luo 阅读(4) 评论(0) 推荐(0)

2026年6月7日

14周轮播图

摘要：轮播图 <style> div.content{ width: 200px; height: 200px; margin: 0 auto; } li{ float: left; list-style-type: none; } a{ color: #000; text-decoration: non 阅读全文

posted @ 2026-06-07 22:40 feng-luo 阅读(5) 评论(0) 推荐(0)

2026年5月31日

13周，位移

摘要： /*第一张图移动到第二张图的位置上*/ img:first-child{ transform: translate(60px); } 阅读全文

posted @ 2026-05-31 21:32 feng-luo 阅读(6) 评论(0) 推荐(0)

2026年5月25日

12周

摘要：相对位置绝对位置 .parent{ margin: 100px auto; width: 800px; height: 400px; border: 10px solid red; /*父级设置为相对*/ position: relative; } .son{ width: 100px; heigh 阅读全文

posted @ 2026-05-25 20:55 feng-luo 阅读(10) 评论(0) 推荐(4)

2026年5月20日

服务器字体

摘要：服务器字体 div{ margin: 0 auto;/*容器相对于浏览器居中*/ width: 800px; font-size: 16px;/*默认字号*/ font-family: "微软雅黑";/*默认字体*/ /*em适用于首行缩进2字符*/ background-color: #00FF0 阅读全文

posted @ 2026-05-20 08:15 feng-luo 阅读(13) 评论(0) 推荐(4)

9周盒模型的外三层的结构

摘要：盒模型的外三层的结构 *{margin: 0;padding: 0;} div.son{ margin: 0 auto; width: 400px; /*height: 400px;*/ background-color: yellow; padding: 40px 60px; /*font-siz 阅读全文

posted @ 2026-05-20 08:14 feng-luo 阅读(12) 评论(0) 推荐(4)

11周浮动方法排列类似棋盘效果

摘要： //浮动方法排列类似棋盘效果 .main{ margin: 0 auto; width: 800px; height: 800px; display: flex; line-height: 400px; font-size: 24px; color: #FFFFFF; text-align: cen 阅读全文

posted @ 2026-05-20 08:08 feng-luo 阅读(12) 评论(0) 推荐(4)

公告