设为首页收藏本站
开启辅助访问
搜索
快捷导航
论坛 › 学院 › 平面设计学院 › 作业
发新帖
返回列表
1 633
电梯直达  跳转到指定楼层

[作业] 作业

发表于 2018-1-18 15:42 | 复制链接 | 打印 | 上一主题 | 下一主题
Dreamweaver CC零基础入门教程 - 5.9 导航条案例及伪类选择器
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>css样式</title>
  6. <style>
  7.         body{margin: 0;}
  8.         .as{width: 100%; height:50px; background-color:#09C; margin-top:100px; min-width:1100px;}
  9.         .ad{float:left; height:50px; width:780px; margin-left:135px;}
  10.         .af{ float:right;}
  11.         .as .ag{ font-size:18px; color:#FFF; font-family:"微软雅黑"; line-height:50px; text-decoration:none; display:block; float:left; text-align:center;}
  12.         .ad .ag:hover{ background-color:#039;}
  13.         .as .ad .ag .ah { width:102px; display:inline-block;}
  14.         .as .aj{ width:134px; display:inline-block;}
  15.         .as .ak{ font-size:18px; color:#FFF; font-family:"微软雅黑"; line-height:50px; text-decoration:none; display:block;text-align:center; margin-right:135px;}
  16. </style>
  17. </head>

  19.   <body>
  20.   <div class="as">
  21.       <div class="ad">
  22.       <a href="#" class="ag"><span class="ah">首页</span></a>
  23.       <a href="#" class="ag"><span class="ah">分类</span></a>  
  24.       <a href="#" class="ag"><span class="aj">特色百科</span></a>  
  25.       <a href="#" class="ag"><span class="ah">用户</span></a>
  26.       <a href="#" class="ag"><span class="aj">权威百科</span></a>  
  27.       <a href="#" class="ag"><span class="aj">手机百科</span></a>
  28.       </div>
  29.       <div class="af">
  30.       <a href="http://www.baidu.com" class="ak"><img src="images/user.png" />  个人中心</a>
  31.       </div>
  32.   </div>
  33. </body>
  34. </html>
复制代码
我自己手写的代码 可能看着有点乱 然后老师留的一个小问题 我用span标签解决了 不知道和老师想说的方法是不是一样
举报 使用道具
| 回复

共1个回复 最后回复于 2018-1-18 18:23

lori棒棒糖
版主
勤币 13901   学币 196  
沙发
发表于 2018-1-18 18:23:22 | 只看该作者
用span标签也可以的~
举报 使用道具
回复 支持 反对
发新帖
返回列表
B Color Image Link Quote Code Smilies
高级模式
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

快速回复 返回顶部 返回列表