猿问

回到首页 个人中心 反馈问题 注册登录
下载APP
首页 课程 实战 体系课 手记 专栏 慕课教程

带箭头的号召性用语按钮

号召性用语按钮图片（想要没有 1px 实线的结果）

该按钮的 HTML 和 CSS 代码是什么？需要是容器的全宽并且具有响应能力。

.btn{
width: 100%;
padding: 18px 15px;
background: none;
border-radius: 2px;
color: #111;
font-size: 16px;
font-weight: 600;
border: 2px solid 111;}


眼眸繁星
浏览 118回答 3
3回答

暮色呼如

我认为这会有所帮助<!DOCTYPE html><html>&nbsp; &nbsp; <head>&nbsp; &nbsp; &nbsp; &nbsp; <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">&nbsp; &nbsp; &nbsp; &nbsp; <script src='https://kit.fontawesome.com/a076d05399.js'></script>&nbsp; &nbsp; &nbsp; &nbsp; <style>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; #div1 {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; box-sizing: border-box;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin-top: 20px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin-bottom: 20px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text-align: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; #btn1{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; vertical-align: middle;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; cursor: pointer;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; user-select: none;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: rgb(255, 255, 255);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background-color: rgb(0, 95, 201);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; display: inline-block;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 19px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; line-height: 1.45;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-top: 12px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-bottom: 12px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-family: "Urban Grotesk", "Helvetica Neue", sans-serif;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text-align: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-left: 32px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-right: 32px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text-decoration: none;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-color: rgb(0, 95, 201);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-width: 2px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-style: solid;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-radius: 9999px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s !important;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; #btn2{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; width: 100%;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; vertical-align: middle;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; cursor: pointer;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; user-select: none;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: rgb(255, 255, 255);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background-color: rgb(0, 95, 201);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; display: inline-block;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 19px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; line-height: 1.45;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-top: 12px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-bottom: 12px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-family: "Urban Grotesk", "Helvetica Neue", sans-serif;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text-align: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-left: 32px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-right: 32px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text-decoration: none;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-color: rgb(0, 95, 201);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-width: 2px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-style: solid;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-radius: 9999px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s !important;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .gkIVBh {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; box-sizing: border-box;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin-left: auto;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin-right: auto;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-left: 16px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-right: 16px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; max-width: 1000px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; @media screen and (min-width: 32em){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .jeGMXo {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin-bottom: 60px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .jeGMXo {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; box-sizing: border-box;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin-bottom: 40px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 80px, rgba(0, 0, 0, 0.1) 0px 3px 10px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; display: flex;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; -webkit-box-align: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; align-items: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; -webkit-box-pack: justify;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; justify-content: space-between;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background-color: rgb(245, 248, 249);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding: 20px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-radius: 10px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; transition: background-color 100ms ease-out 0s;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text-decoration: none;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .dVEcjR {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; box-sizing: border-box;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; -webkit-box-align: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; align-items: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; display: flex;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .cjNzCs {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding-left: 10px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin-top: 0px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: rgb(11, 22, 63);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 14px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; line-height: 20px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .bgMUcD {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; width: 24px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; height: 24px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: rgb(11, 22, 63);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; flex: 0 0 auto;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .ggXKIR {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; width: 24px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; height: 24px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: rgb(11, 22, 63);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; flex: 0 0 auto;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .btn3{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; vertical-align: middle;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border: 3px solid #1aa3cc;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-radius: 5px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding: 20px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background-color: transparent;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .vl {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-left: 1px solid #1aa3cc;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; height: 20px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding: 10px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; </style>&nbsp; &nbsp; </head>&nbsp; &nbsp; <div id="div1">&nbsp; &nbsp; &nbsp; &nbsp; <button id="btn1">Last ned appen</button>&nbsp; &nbsp; </div>&nbsp; &nbsp;&nbsp;&nbsp; &nbsp; <div id="div1">&nbsp; &nbsp; &nbsp; &nbsp; <button id="btn2">Last ned appen</button>&nbsp; &nbsp; </div>&nbsp; &nbsp; <div class="gkIVBh">&nbsp; &nbsp; &nbsp; &nbsp; <a href="https://www.facebook.com/bysykkeloslo/" class="jeGMXo">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="dVEcjR">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <svg fill="currentColor" viewBox="0 0 24 24" size="24" color="text" class="sc-AykKC bgMUcD">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <path fill="currentColor" d="M8.515 7.847H6v4.105h2.515V24h4.832V11.897h3.371l.357-4.05h-3.728v-2.31c0-.952.192-1.336 1.117-1.336h2.618V0h-3.345C10.14 0 8.522 1.583 8.522 4.612c-.007 2.646-.007 3.235-.007 3.235z"></path>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </svg>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div color="text" font-size="[object Object]" class=" cjNzCs">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <font style="vertical-align: inherit;"><font style="vertical-align: inherit;">Get the latest city bike news on our Facebook page</font></font>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <svg fill="currentColor" viewBox="0 0 24 24" color="text" class="sc-AykKC ggXKIR">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <path fill="currentColor" fill-rule="evenodd" d="M7.118 21.585a1.333 1.333 0 01.048-1.885l8.21-7.7-8.21-7.7a1.333 1.333 0 011.837-1.933L19.248 12 9.004 21.633a1.333 1.333 0 01-1.885-.048z" clip-rule="evenodd"></path>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </svg>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; </div>&nbsp; &nbsp; <div id="div1">&nbsp; &nbsp; &nbsp; &nbsp; <button class="btn3">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span style="padding:10px;color:#1aa3cc;font-size: 120%;">Call to Action</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class="vl"></span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class="fa fa-arrow-right" style="padding:10px;font-size:24px;color:#1aa3cc"></span>&nbsp; &nbsp; &nbsp; &nbsp; </button>&nbsp; &nbsp; </div></html><!DOCTYPE html><html>&nbsp; &nbsp; <head>&nbsp; &nbsp; <link type="text/css" href="https://arbeidsplassen.nav.no/css/app.css" rel="stylesheet">&nbsp; &nbsp; &nbsp; &nbsp; <style>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .div1{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin: 30px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; </style>&nbsp; &nbsp; </head><body><div class="div1">&nbsp; &nbsp; <a href="/stillinger" class="Hovedinngang">&nbsp; &nbsp; &nbsp; &nbsp; <div class="Hovedinngang__left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="Hovedinngang__icon Hovedinngang__icon--green">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <g stroke="#062140" stroke-linejoin="round" stroke-miterlimit="10" fill="none">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <circle cx="8.5" cy="8.5" r="8"></circle>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <path stroke-linecap="round" d="M14.156 14.156l9.344 9.344"></path>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </g>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </svg>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; <div class="Hovedinngang__center">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <h3 class="Hovedinngang__title"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; searching for positions&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </font></font></h3>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; <div class="Hovedinngang__right">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <i class="Hovedinngang__chevron"></i>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </a></div></body></html><!DOCTYPE html><html>&nbsp; &nbsp; <head>&nbsp; &nbsp; &nbsp; &nbsp; <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">&nbsp; &nbsp; &nbsp; &nbsp; <title>&nbsp; &nbsp; &nbsp; &nbsp; </title>&nbsp; &nbsp; &nbsp; &nbsp; <style>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .Hovedinngang {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; width: 50%;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: #062140;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding: 1.5rem;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; display: flex;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; align-items: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border: 1px solid #062140;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-radius: 0.25rem;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; .Hovedinngang__title {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-size: 1.125rem;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; line-height: 1.33;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; font-weight: 600;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; margin: 0;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; </style>&nbsp; &nbsp; </head>&nbsp; &nbsp; <body>&nbsp; &nbsp; &nbsp; &nbsp; <a class="Hovedinngang">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div style="flex: 1;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="Hovedinngang__title">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Søk etter stillinger&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div >&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div style="float:right;padding-right: 20px;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <i class="material-icons" style="font-size: 30px;">keyboard_arrow_right</i>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; </a>&nbsp; &nbsp; </body></html><!DOCTYPE html><html>&nbsp; &nbsp; <head>&nbsp; &nbsp; &nbsp; &nbsp; <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">&nbsp; &nbsp; &nbsp; &nbsp; <title>&nbsp; &nbsp; &nbsp; &nbsp; </title>&nbsp; &nbsp; &nbsp; &nbsp; <style>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; #btn1 {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; width: 50%;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; align-items: center;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; padding: 1.5rem;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; background-color:transparent;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; color: black;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; outline: 0px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border:1px solid black;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; border-radius: 3px;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; </style>&nbsp; &nbsp; </head>&nbsp; &nbsp; <body>&nbsp; &nbsp; &nbsp; &nbsp; <br>&nbsp; &nbsp; &nbsp; &nbsp; <button id="btn1"><span style="font-size: 24px;">Søk etter stillinger</span><i class="material-icons" style="font-size: 30px;float: right;">keyboard_arrow_right</i></button>&nbsp; &nbsp; </body></html>
0

潇湘沐

HTML：&nbsp; &nbsp; <a href="#" class="sc-AykKD Footer__StyledCallOutAnchor-sc-1mqnblr-3 jeGMXo">&nbsp; &nbsp; <svg fill="currentColor" viewBox="0 0 24 24" color="text">&nbsp; &nbsp; <path fill="currentColor" fill-rule="evenodd" d="M7.118 21.585a1.333 1.333 0 01.048-1.885l8.21-7.7-8.21-7.7a1.333 1.333 0 011.837-1.933L19.248 12 9.004 21.633a1.333 1.333 0 01-1.885-.048z" clip-rule="evenodd">&nbsp; &nbsp; </path>&nbsp; &nbsp; </svg>&nbsp; &nbsp; </a>其中“a”CSS：&nbsp; &nbsp; box-sizing: border-box;&nbsp; &nbsp; margin-bottom: 40px;&nbsp; &nbsp; box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 80px, rgba(0, 0, 0, 0.1) 0px 3px 10px;&nbsp; &nbsp; display: flex;&nbsp; &nbsp; -webkit-box-align: center;&nbsp; &nbsp; align-items: center;&nbsp; &nbsp; -webkit-box-pack: justify;&nbsp; &nbsp; justify-content: space-between;&nbsp; &nbsp; background-color: rgb(245, 248, 249);&nbsp; &nbsp; padding: 20px;&nbsp; &nbsp; border-radius: 10px;&nbsp; &nbsp; transition: background-color 100ms ease-out 0s;&nbsp; &nbsp; text-decoration: none;和“svg”CSS：&nbsp; &nbsp; width: 24px;&nbsp; &nbsp; height: 24px;&nbsp; &nbsp; color: rgb(11, 22, 63);&nbsp; &nbsp; flex: 0 0 auto;
0

至尊宝的传说

删除了按钮类，我将其更改为链接类。所以我做了这样的：CSS.start { display: block;  max-width: 1130px; text-align: center; background: #dbf0fa; border-radius: 4px; padding: 20px; margin: -75px auto -16px auto}超文本标记语言<p><a class="start" href="link here">text here</a></p>这是正确的做法吗？我仍然缺少向右浮动的箭头。
0
打开App，查看更多内容
随时随地看视频慕课网APP

相关分类

Html5