|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
可以将站点上所有的网页风格都使用一个CSS文件进行控制,只要修改这个CSS文件中相应的行,那么整个站点的所有页面都会随之发生变动。
网页制造poluoluo文章简介:尺度结构中DIV元素和SPAN元素的区分和使用.
起首讲两个观点,一个是行内元素,一个是块级元素。行业元素是指该元素标志的内容不不会对如今的布局形成影响,属于使用款式,帮助使用款式表等作用;而块级元素为一个块状,独自占有一行,相称于在一个该元素前后各加一个换行。
二者最分明的区分是:DIV(division)是一个块级元素,能够包括段落、题目、表格,以致诸如章节、择要和备注等。而SPAN是行内元素,SPAN的前后是不会换行的,它没有布局的意义,地道是使用款式,当其他行内元素都分歧合时,可使用SPAN。块元素相称于内嵌元素在前后各加一个
换行。实在,块元素和行内元素也不是一成稳定的,只需给块元素界说display:inline,块元素就成了内嵌元素,一样地,给内嵌元素界说了display:block就成了块元素了。
详细步骤:
代码示例:- <style>div,span{border:1pxsolid#000;margin:2px;}</style><div>div1</div><div>div2</div><span>span1</span><span>span2</span><br/><divstyle="display:inline">div3</div><divstyle="display:inline">div4</div><spanstyle="display:block">span3</span><spanstyle="display:block">span4</span>
复制代码 提醒:能够先修正部分代码后再运转
技能:有些伴侣会说DIV是层标签,实在HTML里是没有层这个说法的,只不外是为了易于了解,Dreamweaver里才如许写的,每一个工具都能够成为“层”,只必要给工具界说position属性(值为absolute或relavite)。比方,要让图片成为“层”,能够如许写代码:- <imgsrc="demo.gif"style="posibion:absolute;left:20px;top:20px"/>
复制代码 出格提醒
本例代码运转效果如图所示,为了更能申明成绩,这里给块元素和内嵌元素都加了1像素宽的玄色实线边框,从图中能够看到,DIV默许为块元素,界说display属性值为inline后之内嵌元素显现,而SPAN默以为内嵌元素,界说display属性值为block后则以块元素显现。
SPAN标志有一个主要而有用的特征,即它甚么事也不会做,它的独一目标就是环绕你的HTML代码中的别的元素,如许你就能够为它们指定款式了。
</p>
当遇到几个选择器共享一个声明的时候,可以分组放在一起,每个选择器必须以逗号隔开。例:h1,h2,h3,h4{colorred;}选择器分组时要将每个选择器路径写全,分组结尾不能有逗号。 |
|