Eclipse中如何实现对css样式的自动提示

html-css029

Eclipse中如何实现对css样式的自动提示,第1张

Eclipse Java EE IDE for Web Developers.

Version: Luna Service Release 2 (4.4.2)

Build id: 20150219-0600

当我们想输入例如box-shadow属性的时候,发现没有自动提示。如果完全靠记忆难免出错。

鼠标右键点击此文件,选择【Properties】选项。

点击左侧的【Web Content Settings】,可以看到Css Profile选择的是none。没有定义Css的描述文件。

选择【CSS3:Cascading Style Sheets,level 3】选项,然后点击【OK】按钮保存设置。

实现代码如下:

<divclass="wrap">

<divclass="img"></div>

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

</div>

<divclass="wrap">

<divclass="img"></div>

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

</div>

<divclass="wrap">

<divclass="img"></div>

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

</div>

<style>

.wrap{

width:50px

margin-bottom:10px

position:relative

}

.img{

width:50px

height:50px

border:1pxsolid#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定位,CSSposition属性用于指定一个元素在文档中的定位方式。top、right、bottom、left 属性则决定了该元素的最终位置。

static是position的默认值。

<!DOCTYPEhtml>

<htmllang="en">

<head>

<metacharset="UTF-8">

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

<linkrel="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>

<divclass="container">

<divclass="content">

</div>

</div>

</body>

</html>