Rumah > hujung hadapan web > html tutorial > 背景颜色设置成透明实例教程

背景颜色设置成透明实例教程

零下一度
Lepaskan: 2017-07-20 15:12:43
asal
2229 orang telah melayarinya

1.小三角,通过给一个div设置足够大的边框,让它的上边框,右边框,左边框,的背景颜色设置成透明的,来实现,如下:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			#demo {
				width: 0;
				height: 0;
				/*边框的宽20px*/
				border-width: 20px;
				/*边框样式,实线*/
				border-style: solid;
				/*边框颜色*/
				border-color: transparent transparent red transparent;
			}
		</style>
	</head>

	<body>
		<!--小三角,transparent透明的,-->
	
		<div id="demo">
			
		</div>
	</body>

</html>
Salin selepas log masuk

  2.a标签的移动端问题:

   1》当再点击a标签的时候,它会有默认的背景颜色,解决办法

     1 -webkit-tap-highlight-color:transparent;

   2》当点击时可能会出现下划线,解决方法

    

1 text-decoration: none; //或者2 3          border: none;//或者4 5          outline:none;
Salin selepas log masuk

    3>当鼠标放上去时显出下划线,解决办法;

  

a:hover{
    
text-decoration:none;
}
Salin selepas log masuk

  a标签是一个行内标签,如果要设置它的宽高或多个样式可通过display:block;将其变为块级标签。

    

Atas ialah kandungan terperinci 背景颜色设置成透明实例教程. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan