如何处理css中的超链接？

我已经在html文件中创建了5个超链接，但是我想给它们之间的空间我应该怎么做一点帮助！如何处理css中的超链接？

谢谢！

<body> 
<div class="back"> 

    <div class="image"> 
     <img src="comp.jpg" alt="background image" style="width:100%; height:100%"> 

    </div> 
    <h3 class="name" style="color: #d9d9d9"> 
     ASHUTOSH KUMAR SINGH 
    </h3> 

    <div class="link" align="middle"> 
     <a href="about.html" style="color: white">About</a> 
     <a href="contact.html" style="color: white">Contact</a> 
     <a href="skill.html" style="color: white">Skills</a> 
     <a href="mywork.html" style="color: white">My Work</a> 
     <a href="blog" style="color: white">Blog</a> 

    </div> 
<div class="myimg" align="middle"> 
    <div class="circle" align="middle"> 

    </div> 
    <img src="ashu.jpg" class="myimage" style="height: 300px; width:300px";> 

</div> 
</div>

这是我的css文件：在下面的代码，我已经做了类链接在我级联它。我想给他们之间的一些平等的空间，使它看起来整洁。

html,body{ 
    margin:0; 
} 

div.link{ 
font-size: 25px; 
    position: fixed; 
    /*text-space: 100;*/ 
    margin-top:500px; 
    margin-left: 250px; 
} 
.back{ 
    height: 100%; 
    width: 100%; 
margin: 0; 
} 

.image{ 
    position: fixed; 

} 
.myimg{ 
    position: absolute; 
    margin-top:100px; 
    margin-left: 500px; 
} 
.myimage{ 

    border: 2px solid rgba(114, 114, 114, 0.55); 
    border-radius: 100%; 
} 
.circle{ 
    border: 2px ; 
    border-radius: 100%; 
    background-color: black; 
} 
.name{ 
    position: fixed; 
    margin-top:420px; 
    margin-left: 530px; 
}

来源

2017-02-12 ashu_legacy

请复制你的小提琴至今做了什么左右.. – Lal

我想给间距之间的多条链路帮帮忙！ –

我认为你正在寻找最简单的方法是：

.link a {margin-right:10px;}

与此唯一的问题是，所有的链接元素现在得到了保证金的权利，从第一个到最后一个。如果要排除有没有保证金右边的最后一个元素中，添加产生额外：

.link a:last-child{margin-right:0px;}

还记得CSS可以完美嵌套CSS选择

html body .back .link a{some-css-rule}

的方式，更具体一个选择是，更重要的将是，当浏览器对其进行分析）

<div class="some_class" id="some_id" style="color:grey;">sometext</div> 

#some_id{color:black;} 
.some_class{color:blue;} 
div {color:green;}

颜色将是灰色，因为内嵌选择器的权重高于带有ID的选择器，它的权重比类别为的选择器的权重要大，它比HTML容器的选择器的权重更大。这就是所谓的CSS特异性 CSS-specifity calculator by keegan.st

CSS specifity explained by css-tricks

来源

2017-02-12 16:59:11

thanx！它工作完美。 –

总结他们在一个div和风格的股利与word-spacing: 10px; :)

来源

2017-02-12 16:37:17 Shobhit

尽量避免在您的HTML文件的自定义CSS的样式，包括他们在您的CSS-文件。您可以在您的CSS文件中使用padding或margin，请参阅此link的差异。

YourHTMLfile.html

<head> 
    <link rel="stylesheet" href="YourStyleFile.css"> 
</head> 

<body> 

    ... 

    <div class="link" align="middle"> 
     <a href="about.html">About</a> 
     <a href="contact.html">Contact</a> 
     <a href="skill.html">Skills</a> 
     <a href="mywork.html">My Work</a> 
     <a href="blog">Blog</a> 
    </div> 

</body>

YourStyleFile.css

.link a { 
    padding: 16px; 
    color: white; 
}

编辑：确保创建CSS-文件，并将其添加到您的HTML你<head>节-文件。他们都必须在同一个目录中。为什么我的代码可能不适合你的另一个原因是，也许你有另一个CSS文件覆盖.link类。

来源

2017-02-12 16:55:27 Michael

此代码无效 –

请尝试我编辑的版本 – Michael

如何处理css中的超链接？

回答

相关问题