html用外联css,该如何控制div位置

html-css05

html用外联css,该如何控制div位置,第1张

你的意思是要把div固定在屏幕的某个位置,页面滚动时div的位置也保持不变?那么要这样改:

position:fixed

这跟css是外联还是内联是没任何关系的。

绝对定位(position:absolute)是以页面的左上角为定位基准的(如果父元素也是定位元素则以父元素的左上角作为定位基准),所以当页面滚动时,它也会跟着滚动;

固定定位(position:fixed)则是以窗体的左上角作为定位基准的,因此当页面滚动时,它不会跟着滚动,仍然保持在原位。

<html>

<head>

<style>

.hide {

display:none

}

.show:hover .hide {

display:block

}

</style>

</head>

<body>

<div class="show">

    这是触发用的文字

    <div class="hide">

        这是隐藏内容

    </div>

</div>

</body>

</html>

具体样式自己加就好

在html网页中引入引入css主要有以下四种方式:

(1)行内式

<p style=”color:red”>网页中css的导入方式</p>

(2)嵌入式

<style type=”text/css”>

P{ color:red }

</style>

嵌入式一般写在head中,对于单个页面来说,这种方式很方便。

(3)导入式

<!-- 导入外部样式:在内部样式表的<style></style>标记之间导入一个外部样式表,导入时用@import。 -->

<style type="text/css">

@import "jisuan.css"

</style>

(4)链接式

<link href="jisuan.css" rel=”stylesheet” type=”text/css” />

导入式和链接式差不多,都是从外部引入css文件。但是链接式对于客户端用户浏览网站时,效果会好些。