垂直对齐方式 vertical-align
效果如下
快内谁的高度大，就给谁设置vertial-align.
过渡属性
<style>
img {
width: 200px;
height: 150px;
transition: all 1s;
}
img:hover {
width: 500px;
height: 400px;
}
</style>
</head>
<body>
<img src="./images/huawei.jpg" alt="">
</body>
这时图片会慢慢变大。
透明度
<title>透明度</title>
<style>
div {
width: 500px;
height: 500px;
background-color: orange;
opacity: 0;
opacity: 1;
opacity: 0.15;
}
</style>
</head>
<body>
<div>
<img src="./images/phone.png" alt="">
</div>
</body>
效果如下
光标类型
<title>光标类型</title>
<style>
div {
width: 200px;
height: 200px;
background-color: pink;
cursor: pointer;
cursor: text;
cursor: move;
}
</style>
</head>
<body>
<div></div>