• <cite id="ls72a"></cite>

  • <rp id="ls72a"><nav id="ls72a"></nav></rp>
    <b id="ls72a"></b>

    网页设计时的CSS基本用法

    • 2019-07-17 13:25:12
    • 阅读次数:
    • 作者:盈岚科技小编
    • 来源:http://www.0737dz.com

    CSS样式代码在网页设计时必须保存在.css类型的文本文件中,或者放在网页内<style>标签中,或者在网页设计时插在网页标签的style属性值中,否则是无效的,浏览器会视其如普通的字符串,而不对其进行解析。详细说明如下:   

    ?直接放在标签的style属性中。

    【示例1】在下面代码中,直接使用style属性为标签定义样式。

    <span style="color:red;">红色字体</span>

    <div style="border:solid 1px blue; 

    width:200px; height:200px;"></div>

    这样当浏览器解析这些标签时,检测到该标签包含有style属性,于是就调用CSS引擎来解析这些样式码,并把效果呈现出来。这种通过style属性直接把样式码放在标签内的做法被称之为行内样式,因为它与传统网页布局中在标签增加属性的设计方法没有什么两样,这种方法实际上还没有真正把HTML结构和CSS表现分开进行设计,因此不建议使用。除非为页面中个别元素设置某个特定样式效果而单独进行定义。   

    ?把样式代码放在<style>标签内。

    【示例2】在下面代码中,把样式代码放置在<style>标签内。

    <style type="text/css">body {/*页面基本属性*/    

    font-size: 12px;    

    color: #CCCCCC;}

    /*段落文本基础属性*/

    p { background-color: #FF00FF; }

    </style>

    网页设计时设置<style>时应该指定type属性,告诉浏览器该标签包含的代码是CSS源代码。

    这样当浏览器解析<style>标签所包含的代码时,会自动调用CSS引擎进行解析。这种CSS应用方式也被称为网页内部样式。如果仅为一个页面定义CSS样式时,使用这种方法比较高效,且管理方便。但是在一个网站中,或多个页面之间引用时,使用这种方法会产生代码冗余,不建议使用,而且一页页管理样式也是不经济的。

    内部样式一般放在网页的头部区域,目的是让CSS源代码早于页面源代码下载并被解析,这样避免当网页信息下载之后,由于没有CSS样式渲染而使页面信息无法正常显示。   

    ?保存在.css类型的文件中。

    把样式代码保存在单独的.css类型文件中,然后使用<link>标签或者@import关键字导入。这样当浏览器遇到这些代码时,会自动根据它们提供的URL把外部样式表文件导入到页面中并进行解析。关于这个话题将在之后详细分析。这种应用样式的方式也被称为外部样式。一般网站都采用外部样式来设计网站的表现层问题,以便统筹设计CSS样式,并能够快速开发和高效管理。

    当前文章标题:网页设计时的CSS基本用法

    当前URL:http://www.0737dz.com/news/wzzz/3054.html

    上一篇:网站建设中的CSS基础

    下一篇:网页设计中的CSS样式表

    网站建设、网络营销咨询专线:181-8386-5875(点击可一键拨号)
    日本三级香港三级人妇99,亚洲欧美中文日韩综合图区,欧美黄网站色视频免费,哈啊往里噗嗤好深bl纯肉np 网站地图