一个九宫格用hHTML和CSS怎么制作？每个格子都有不同颜色 急求，html中用div做一个框架图，每个区域都有不同颜色的
\u4e5d\u5bab\u683c\u56fe\u7247\u6bcf\u4e2a\u683c\u5b50\u989c\u8272\u90fd\u4e0d\u4e00\u6837\u662f\u4e0d\u662f\u8fd9\u6837\uff1f
\u5148\u5728\u6807\u7b7e\u91cc\u5199\u51e0\u4e2aCSS
.blue{ background-color:Blue; };
.yellow{ background-color:Yellow };
\u8fd8\u60f3\u8981\u4ec0\u4e48\u989c\u8272\u81ea\u5df1\u518d\u5199\u5c31\u884c\u4e86\uff0c\u7136\u540e\u54ea\u4e2a\u91cc\u60f3\u8981\u4ec0\u4e48\u989c\u8272\uff0c\u5c06\u7684class\u5c5e\u6027\u8bbe\u6210\u5bf9\u5e94\u7684CSS\u540d\u79f0\u5c31\u884c\u4e86\u3002\u4f8b\u5982\u8fd9\u4e2a\u80cc\u666f\u5c31\u662f\u84dd\u7684\uff0c\u8fd9\u6837\u5199\u65b9\u4fbf\u4ee5\u540e\u518d\u4fee\u6539\uff0c\u4e0d\u5fc5\u4fee\u6539\u6bcf\u4e00\u4e2a\uff0c\u53ea\u9700\u8981\u4fee\u6539\u91cc\u5b9a\u4e49\u7684\u4ee3\u7801\u5c31\u884c\u4e86
<!DOCTYPE html>
<html>
<head>
<meta charset="GBK">
<title>test</title>
<style type="text/css">
*{
box-sizing: border-box;
margin: 0;
padding: 0;
}
.container{
width: 90px;
height: 90px;
}
.item{
width: 30px;
height: 30px;
display: block;
float: left;
}
</style>
</head>
<body>
<div class="container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
</body>
</html>
<script type="text/javascript">
var items = document.querySelectorAll('.item');
Array.prototype.slice.call(items, 0).forEach(function(item){
item.style.backgroundColor = '#'+(~~(Math.random()*(1<<24))).toString(16);
});
</script>
<!DOCTYPE html>
<html>
<head>
<title>Sudoku</title>
<style type="text/css">
td{
height:100px;
width:100px;
}
#leftUp{
background-color:#FFE4E1;
}
#upCenter{
background-color:#FFE4C4;
}
#rightUp{
background-color:#FFE4B5;
}
#centerLeft{
background-color:#FFE1FF;
}
#center{
background-color:#FFDEAD;
}
#centerRight{
background-color:#FFDAB9;
}
#leftDown{
background-color:#FFD700;
}
#downCenter{
background-color:#FFD39B;
}
#rightDown{
background-color:#FFC1C1;
}
</style>
</head>
<body>
<table>
<tr>
<td id="leftUp"></td>
<td id="upCenter"></td>
<td id="rightUp"></td>
</tr>
<tr>
<td id="centerLeft"></td>
<td id="center"></td>
<td id="centerRight"></td>
</tr>
<tr>
<td id="leftDown"></td>
<td id="downCenter"></td>
<td id="rightDown"></td>
</tr>
</table>
</body>
</html>
大div，套div，加float浮动，加上颜色，ok
绛旓細0;}.a div{width:99px;height:99px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;float:left;}</style><div class="a"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>杩欎釜搴旇涓嶇敤position...
绛旓細绗竴闃舵鈥斺HTML鍙奀SS鍏ラ棬 鐔熸倝HTML锛5锛夊父鐢ㄦ爣绛惧拰CSS锛3锛夎娉曪紝鐞嗚В鐩掑瓙妯″瀷鐨勫悇涓粍鎴愩傝兘鐢ㄤ笉鍚屾柟娉曞疄鐜涔濆鏍甯冨眬銆傚鍓嶇椤甸潰瀹炵幇鏈夊垵姝ヤ簡瑙ｏ紝鑳藉鏌ヨ璧勬枡瀹屾垚涔濆鏍煎竷灞锛屽苟涓斾笉鏂殑浼樺寲鑷繁鐨勪唬鐮侊紝鍩瑰吇鍑鸿壇濂界殑涔犳儻銆傜浜岄樁娈碘斺斿父瑙乄EB椤甸潰鍙婅嚜閫傚簲 鍒濇浜嗚В绉诲姩绔竷灞鍜屽唴瀹硅嚜閫傚簲锛岀啛缁冧娇鐢...
绛旓細鎴睆鐨勬椂鍊欐病鏈夋悶濂芥垨鑰呮槸鎵嬫満鍑轰簡闂銆備竴鑸埅鍥惧悗鍙槸瑁佸壀浜嗗浘鐗囩殑鏌愪釜閮ㄤ綅锛屽鏋滃嚭鐜扮櫧鑹插浘鐗囩殑璇濆彲鑳芥槸鎵嬫満娌℃湁杩愯濂斤紝鎴栬呭嚭浜嗛棶棰樸傚垏鍥炬槸鎸囧皢璁捐绋垮垏鎴愪究浜庡埗浣滄垚椤甸潰鐨勫浘鐗囥傚垏鍥剧敤浜庡畬鎴html+css甯冨眬鐨勯潤鎬侀〉闈紝鏈夊埄浜庝氦浜掞紝褰㈡垚鑹ソ鐨勮瑙夋劅銆傞氫織鏉ヨ锛屾妸涓寮犺璁″浘鍒╃敤鍒板垏鐗囧伐鍏 鎶婅嚜宸辨墍...
绛旓細浣犲彲浠ヨ繖鏍锋潵鐞嗚В锛歜order-image-slice 鏄杈规鍥剧墖鐨勫垏鍓诧紙绫讳技涔濆鏍鐨勬柟寮忥級锛屾妸涓寮犲浘鐗囧垎鍓蹭负涔濅釜閮ㄥ垎锛屽垎鍒綔涓鸿竟妗嗙殑宸︿笂瑙掋佷笂杈规銆佸彸涓婅銆佸彸杈规銆佸彸涓嬭銆佷笅杈规銆佸乏涓嬭銆佸乏杈规浠ュ強涓棿閮ㄥ垎锛堣繖涓氬父鏄拷鐣ョ殑锛夛紝绫讳技涓嬪浘 鐢ㄤ笂鍙充笅宸﹀洓鈥滃垁鈥濆氨鎶婂浘鐗囧垏鎴愪節浠戒簡 鑰岃鎯虫妸涓寮犲浘鐗...
绛旓細璁剧疆鐨勫浘鐗囧皢浼氳鈥滃垏鍓测濇垚涔濆鏍褰㈠紡锛岀劧鍚庤繘琛岃缃傚涓嬪浘 by涓変汉琛屾厱璇 鈥滃垏鍓测濆畬鎴愬悗鐢熸垚铏氭嫙鐨9鍧楀浘褰紝鐒跺悗鎸夊搴斾綅缃缃儗鏅紝鍏朵腑鍥涗釜瑙掍綅缃佸舰鐘朵繚鎸佷笉鍙橈紝涓績浣嶇疆姘村钩鍨傜洿涓や釜鏂瑰悜骞抽摵銆傚涓嬪浘 by涓変汉琛屾厱璇 round 浼氳嚜鍔ㄨ皟鏁村昂瀵革紝瀹屾暣鏄剧ず杈规鍥剧墖銆俽epeat 鍗曠函骞抽摵澶氫綑閮ㄥ垎锛屼細琚...
绛旓細鍏充簬CSS Sprites鎶鏈殑浼樺寲鎴戜滑鑳藉仛鍒板灏戯紝鑳藉噺澶氬皯鐨勮姹傛暟閲忋傝繖骞朵笖涓嶆槸鍗曟柟闈㈣兘鍋氬埌鐨勶紝涓鍒囧彇鍐充簬XHTML銆丆SS銆丆SS Sprites鍥剧墖涔嬮棿鐨勯厤鍚堛傜幇鏃朵负姝㈡病鏈夌粷瀵逛紭鍖栫殑鍋氭硶锛岃繖涔熸槸鎴戝湪椤圭洰涓粡甯歌 閲廋SS Sprites鍥剧墖涓嶺HTML鍏崇郴锛屽:銆婁竴寮犺儗鏅疄鐜拌嚜閫傚簲涔濆鏍銆嬶紝浠ヤ笅鎬荤粨浜嗗浘鐗囧垏鍓叉湳涓庡浘璞′紭鍖栫殑涓浜...
绛旓細鍋囪鐜板湪杈规鐨勫搴︽槸27鍍忕礌锛屽垯涓婇潰鎵璇寸殑涔濋儴鍒嗘濡備笅鍥炬墍琛ㄧず鐨勶紙鏀惧ぇ400%锛夛細1銆佽皟鐢ㄨ竟妗嗗浘鐗嘼order-image鐨剈rl灞炴э紝閫氳繃鐩稿鎴栫粷瀵硅矾寰勯摼鎺ュ浘鐗囥2銆佽竟妗嗗浘鐗囩殑鍓border-image鐨勬暟鍊煎弬鏁板壀瑁佽竟妗嗗浘鐗囷紝褰㈡垚涔濆鏍銆3銆佸壀瑁佸浘鐗囧～鍏呰竟妗嗚竟妗嗗浘鐗囪鍒囧壊鎴9閮ㄥ垎锛屼互涓涓瀵瑰簲鐨勫叧绯绘斁鍒癲iv杈规鐨勪節瀹牸涓...
绛旓細杩欑鏍峰瓙鐨勶紝涓嶈兘鏄櫘閫氱殑鍥剧墖锛岃繖涓氨鏄浘鐗囧悜鍐呯殑鍋忕Щ閲忥紝杩欎釜鍋忕Щ閲忕殑鏈姝ｅ父鐨勫煎氨鏄瘡涓皬鍧楃殑瀹藉害锛屽綋鐒朵篃鍙互涓嶇敤杩欐牱锛屼絾鏄篃闇瑕佹壘涓悎閫傜殑鍊硷紝杩欎釜鍚堥傜殑鍊兼牴鎹笉鍚岀殑鑳屾櫙鍥炬槸涓嶄竴鏍风殑锛岃繖涓渶瑕佽嚜宸卞鍋氬嚑涓浘鐗囷紝鏀规垚涓嶅悓鐨勫艰瘯涓涓嬶紝甯屾湜瀵逛綘鏈夊府鍔╋紝涓嶆噦璇风户缁拷闂紝瑙ｅ喅璇烽噰绾 ...
绛旓細鍦ㄧ敤appcan鍋歨ybrid app鏃,鍙戠幇鍦ㄥ崕涓簃eta8涓,鐢 ul li 鍋涔濆鏍,li 娴姩鎺掑湪涓琛屾椂,姣忎釜 li 鏈夋枃瀛,楂樺害鐢╨i鐨勮楂樻拺寮鐨,娌℃湁鏂囧瓧鐨 li 鍜屾湁鏂囧瓧鐨 li 鐨勯珮搴︽槸涓嶄竴鏍风殑銆傛湁鐨勬牸瀛愭湁鏂囧瓧鏈夌殑娌℃湁鏂囧瓧,瀵艰嚧涔濅釜鏍煎瓙娌℃湁鎺掑湪3琛,鏈夋牸瀛愭帀涓嬪幓浜,鎺掓垚浜4琛屻傛墍浠,鍦ㄧ敤琛岄珮璁╂枃瀛楀眳涓椂,楂樺害鍜岃楂樿...
绛旓細[s:30]瀹屽叏鑷畾涔夊疄鐜扳滃崄鍏瀹牸鈥濆崱鐩樻帓鐗圼8琛css鏍峰紡]
