div+css基础——8.绝对定位应用(照片签名)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>绝对定位应用(照片签名)</title> <meta name="keywords" content="自定义关键字"/> <meta name="description" content="自定义描述"/> <meta http-equiv="content-type" content="text/html;charset=utf-8"/> <style type="text/css"> #image{ position:relative; background-image:url(girl.png); width:600px; height:450px; } #name{ position:absolute; right:30px; bottom:30px; font-size:30px; color:red; font-weight:bold; } </style> </head> <body> <div id="image"> <div id="name">芙蓉姐姐</div> </div> </body> </html>
效果截图: