課程
/前端開發
/HTML/CSS
/CSS Sprite雪碧圖應用
一個比較完善的代碼做好。??上Р荒芟蛳录嫒軮E瀏覽器。 在IE較低版本中,鼠標點擊文本或密碼框后 光標的位置bug,以及登錄和注冊按鈕背景空白無法顯示bug。有木有大牛給個解決方法參考下?
2015-10-16
源自:CSS Sprite雪碧圖應用 4-1
正在回答
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<style>
*{
? ? margin:0;
? ? padding:0;
}
form{
? ? width:200px;
? ? padding:5px 10px;
? ? background-color:lightblue;
.block {
? ? width:190px;
? ? height:38px;
? ? display:block;
? ? margin:10px 0;
? ? font-size:15px;
? ? text-indent:2em;
label,a{
? ? font-size:80%;
text-decoration:none;
label{
? ? margin-right:25px;
.button{
? ? border:none;
? ? background-image:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg);
#signup{
background:url(sp.png)0 -38px;
display:inline;
</style>
</head>
<body>
<form>
? ? <input class="block" placeholder="郵箱/手機號/用戶名">
? ? <input class="block" placeholder="請輸入密碼">
? ? <input type="checkbox" id="remember">
? ? <label for="remember">下次自動登錄</label>
? ? <a href="#">忘記密碼?</a>
? ? <!--<button class="block" id="login"></button>
? ? <button class="block" id="signup"></button>-->
? ? <div class="block"><input ?class="button" type="button"></div>
? ? <div class="block"><input ?class="button" type="button" id="signup"></div>
? ??
</form>
</body>
</html>
調一天了 ?就是 背景圖片不顯示 ?求大神指導?
你加上這句試試
<meta charset="UTF-8" http-equiv="X-UA-Compatible" content="IE=10">
這個是效果圖
舉報
必學的大型網站實用技術,讓你快速掌握CSS Sprite雪碧圖技術
1 回答這代碼有問題嗎?為什么雪碧圖沒有完整的出來?
8 回答求大神看看我的代碼~~
1 回答是我的代碼有問題么?為什么做出來的效果跟老師演示的不一樣呀?
3 回答下面是我寫好了的程序 我想請問各位大神我的代碼還有哪些應該注意的問題???
2 回答和視頻里面的代碼有出入
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2015-10-20
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<style>
*{
? ? margin:0;
? ? padding:0;
}
form{
? ? width:200px;
? ? padding:5px 10px;
? ? background-color:lightblue;
}
.block {
? ? width:190px;
? ? height:38px;
? ? display:block;
? ? margin:10px 0;
? ? font-size:15px;
? ? text-indent:2em;
}
label,a{
? ? font-size:80%;
text-decoration:none;
}
label{
? ? margin-right:25px;
}
.button{
? ? border:none;
? ? background-image:url(http://img1.sycdn.imooc.com//539a972b00013e9102280177.jpg);
}
#signup{
background:url(sp.png)0 -38px;
display:inline;
}
</style>
</head>
<body>
<form>
? ? <input class="block" placeholder="郵箱/手機號/用戶名">
? ? <input class="block" placeholder="請輸入密碼">
? ? <input type="checkbox" id="remember">
? ? <label for="remember">下次自動登錄</label>
? ? <a href="#">忘記密碼?</a>
? ? <!--<button class="block" id="login"></button>
? ? <button class="block" id="signup"></button>-->
? ? <div class="block"><input ?class="button" type="button"></div>
? ? <div class="block"><input ?class="button" type="button" id="signup"></div>
? ??
? ??
</form>
</body>
</html>
調一天了 ?就是 背景圖片不顯示 ?求大神指導?
2015-10-16
你加上這句試試
2015-10-16
<meta charset="UTF-8" http-equiv="X-UA-Compatible" content="IE=10">
2015-10-16