片刻网项目
片刻网项目 复习回顾——页面布局 如图，需要实现的布局为经典的三列布局（logo、导航、登录注册按钮）。 对于这种情况首先想到的应该是这样的。 也就是说在一个大的容器中，我们在写入一个容器（红色）作为存放绿色容器、蓝色容器、紫色容器 。那么实现起来就很简单了。 <!-- 黑色的大容器 --> <header class="head"> <!-- 红色部分 --> <div class="container"> <!-- 绿色部分 --> <div class="logo"></div> <!-- 蓝色部分 --> <div class="nav"></div> <!-- 紫色部分 --> <div class="login"></div> </div> </header> 第一步需要做的就是黑色的容器的宽度设置为100%,这是为了给里边的元素实现居中。 .head ...
css实现动态效果
css实现动态效果 个人头像悬停特效 效果图： 代码示例： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> .img { width: 150px; height: 150px; margin: 100px auto; background: lightcoral; border-radius: 50%; } .img img { width: 100%; border-radius: 50%; transform: scale(1); transition: all ...
