html中怎么用CSS实现将一个网页的主体部分分为9块 ？就是3*3的那种形式。

html-css014

html中怎么用CSS实现将一个网页的主体部分分为9块 ？就是3*3的那种形式。,第1张

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>3*3 </title>

<meta name="Generator" content="EditPlus">

<meta name="Author" content="">

<meta name="Keywords" content="">

<meta name="Description" content="">

</head>

<style type="text/css">

*{margin:0 autotext-align:center}

.no{width:912pxheight:912pxbackground:red}

.no1{width:300pxheight:300pxbackground:#121margin:2pxfloat:left}

.no2{width:300pxheight:300pxbackground:#122margin:2pxfloat:left}

.no3{width:300pxheight:300pxbackground:#123margin:2pxfloat:left}

.no4{width:300pxheight:300pxbackground:#124margin:2pxfloat:left}

.no5{width:300pxheight:300pxbackground:#125margin:2pxfloat:left}

.no6{width:300pxheight:300pxbackground:#126margin:2pxfloat:left}

.no7{width:300pxheight:300pxbackground:#127margin:2pxfloat:right}

.no8{width:300pxheight:300pxbackground:#128margin:2pxfloat:right}

.no9{width:300pxheight:300pxbackground:#129margin:2pxfloat:right}

</style>

<body style="align:center">

<div class="no">

<div class="no1"></div>

<div class="no2"></div>

<div class="no3"></div>

<div>

<div class="no4"></div>

<div class="no5"></div>

<div class="no6"></div>

<div>

<div>

<div class="no7"></div>

<div class="no8"></div>

<div class="no9"></div>

</div>

</div>

</div>

</body>

</html>

你的HTML代码 特别是A标签 嵌套错误。应该是：<a href="图片9的链接" style="margin:0padding:0"><img src="图片1" alt="" width="" height=""></a>

margin:0padding:0的意思是 边距为0，无缝

这位网友你好，三角形边框只是利用了一个元素的边框，元素本身宽高都为0，把边框颜色设置为透明色，然后需要的一边设置为自己想要的颜色即可。

div{

  border:20px solid transparent

  border-left-color:#ff0000

}

例如上面就是一个向右的三角形。当然你可以可以利用左边框和下边框拼成一个大三角形，其他都类似。