Div+Css一个初体验例子

众所周知,网页设计经历了三个时期,table,table+css,div+css,现在主流的门户网站都是使用div+css。

同样,div+css能够是网页的代码简洁,并且对搜索引擎更加友好。

/*div是用于存放html元素,文字,图片,视频的元素*/
/*css是层叠样式表,用于去指定div中的内容的样式*/

下面来演示一个简单的div+css网页

首先是网页代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>div.html</title> <!-- 引入DIV --> <link href="/HTML/css/my.css" type="text/css" rel="stylesheet"> </head> <body> <div class="style1"> <table> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> <tr> <td>4</td> <td>5</td> <td>6</td> </tr> <tr> <td>7</td> <td>8</td> <td>9</td> </tr> </table> </div> </body> </html>
然后是css

/*div是用于存放html元素,文字,图片,视频的元素*/ /*css是层叠样式表,用于去指定div中的内容的样式*/ .style1{ width: 300px; height: 200px; border: 1px solid red; margin: 0px 0px 0px 20px; } .style1 table { width: 298px; height: 198px; border: 1px solid black; } .style1 table td{ border: 1px solid black; text-align: center; }
注意html要引入css这个文件,然后就完毕了,整体来说,代码确实更加简洁美观。确实很舒服。


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值