想知道怎样设计的-慕课网

首页课程实战体系课手记专栏慕课教程

想知道怎样设计的

来源：1-1 什么是CSS3？

南栀8

2017-03-19 10:38

这种效果是通过什么设计的？

写回答关注

2回答

空尘

2017-03-19 12:38:54

已采纳

我随便写来练手的不难哦只要你HTML+CSS学会了就很简单的
<style>
           *{
               margin: 0;
           }

           .nav{

               list-style: none;
               width: 700px;
               height: 50px;
               margin: 20px auto;
               background: pink;
               border-radius: 10px;
               box-shadow: 0 5px 5px #4D555D;

           }
           .nav li{
               position: relative;
               top: 15px;
               left: 2px;
               padding:0 20px;
               float: left;
               text-align: center;
               border-right: 1px solid #AAAE83;
           }
           .nav a{
               text-decoration: none;
               font: 16px/16px "微软雅黑";
               color: #fff;
               font-weight: 800;
               text-shadow: 1px 1px 1px #00C8C8;
           }
           .nav li:nth-of-type(6){
               border: none;
           }
       </style>
   </head>
   <body>
       <ul class="nav">
           <li><a href="">Home</a></li>
           <li><a href="">About Me</a></li>
           <li><a href="">Portfolio</a></li>
           <li><a href="">Blog</a></li>
           <li><a href="">Resources</a></li>
           <li><a href="">Contact Me</a></li>
       </ul>
   </body>

0 0
南栀8

2017-03-20 08:18:12

好，谢谢帮忙，我试试。

0 0

十天精通CSS3

本课程为CSS3入门教程，深刻详解CSS3知识让网页穿上绚丽装备

242553 学习 · 2623 问题

相似问题

我想知道为什么设置line-height为100px?

回答 1

我想知道这堆代码是怎么想出来的啊，从psd测量吗

回答 3

不知道怎样做出导航分割线

回答 1

字体的路径怎麽知道的？

回答 3

Responsive设计

回答 2

打开慕课网App查看更多内容