html如何使用css提示信息

html如何使用css提示信息,第1张

12月15日更新

这是一个值得纪念的日子,经过若干个月若干个版本的等待,

VSCode 1.8中的HTML已提供完整的CSS与Javascript支持。

感谢一直以来关注这个问题的朋友,欢呼吧大家~

==================================================================

原回答

知乎首答……

升了1.3之后立马就发现这个问题了,js那个倒是很久之前就一直有了,超级不方便,也不知是怎么想的。

一开始以为是我电脑的bug,后来上了github才发现不只是我一个人遇到了这个问题。

然后仔细翻了一下1.3的doc发现CSS被提取出来了(可能是因为这个原因导致css in html的提示丢失了)

实现代码如下:

<div class="wrap">

<div class="img"></div>

<div class="notice">1</div>

</div>

<div class="wrap">

<div class="img"></div>

<div class="notice">12</div>

</div>

<div class="wrap">

<div class="img"></div>

<div class="notice">13</div>

</div>

<style>

.wrap {

width:50px

margin-bottom:10px

position:relative

}

.img {

width:50px

height:50px

border:1px solid #000

}

.notice {

width:20px

height:20px

line-height:20px

font-size:10px

color:#fff

text-align:center

background-color:#f00

border-radius:50%

position:absolute

right:-10px

top:-10px

}

</style>

扩展资料:

注意事项

主要用到position定位,CSS position属性用于指定一个元素在文档中的定位方式。top、right、bottom、left 属性则决定了该元素的最终位置。

static是position的默认值。

<!DOCTYPE html>

<html lang="en">

<head>   

<meta charset="UTF-8">   

<title>CSS-position-static</title>   

<link rel="stylesheet" href="https://cdn.bootcss.com/normalize/8.0.0/normalize.css">

  <style>

      .container{

         background-color: #868686

           width: 100%

           height: 300px

       }

       .content{

           background-color: yellow

           width: 100px

          height: 100px

           position: static

           left: 10px/* 这个left没有起作用 */

       }

   </style>

</head>

<body>

  <div class="container">

       <div class="content"> 

       </div>

   </div>

</body>

</html>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7291031.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-03
下一篇 2023-04-03

发表评论

登录后才能评论

评论列表(0条)

保存