CSS基础

作者: 饥人谷_南华散人 | 来源:发表于2017-09-20 00:22 被阅读9次

    CSS的全称是什么?

    CSS的全称叫 Cascading Style Sheets 中文名叫 层叠样式表
    它的作用是结构化文档,通过改变文档中的字体,颜色,间距等方式来美化网页,提高网页的可读性与观赏性。

    CSS有几种引入方式? link 和@import 有什么区别?

    CSS的引用方式一般有三种,分别是内联样式、内部样式、外部样式。

    内联样式就是直接在HTML标签中写入CSS样式。
    <h1 style="color: red; font-size: 20px;">CSS基础<h1>

    内部样式就是把CSS写在HTML的文档流中,通过<style> 标签定义样式。

    <head>
    <style type="text/css">
      h1{margin-left: 100px; color: red}
    </style>
    </head> 
    

    外部样式就是把CSS独立编写并且在每个HTML页面用<link>标签链接的样式就是外部样式。

    <head>
      <link rel="stylesheet" type="text/css" href="a.css">
    </head
    

    <thyle>
    @import url ("a.css");
    @import "b.css";
    </thyle>
    

    link@import的区别是link是一个html的标签 它可以直接写在html的文档中的任何位置(当然并不建议这么任性的去写。)而@import是一个CSS中的语法,它只能放在样式表中使用,并不能直接写在html文档中。

    以下路径分别用在什么地方,代表什么意思。

    1. css/a.css                               为相对路径  指向当前目录的同级css目录下的a.css文件
    2. ./css/a.css                             为相对路径  指向当前目录的下级css目录里的a.css文件
    3. b.css                                   为相对路径  指向当前目录下的b.css文件
    4. ../imgs/a.png                           为相对路径  指向上级目录下的ings目录中的a.png文件
    5. /Users/hunger/project/css/a.css         为绝对路径  完整的写出a.css文件所在的全部路径 可以精准的引用a.css文件
    6. /static/css/a.css                       为网络路径  上传到互联网的网站里a.css文件的相对路径。
    7. http://cdn.jirengu.com/kejian1/8-1.png  为网络路径  此为一张图片的网络路径 可以直接引用该路径就能在网页中展示该图片。
    

    如果我想在js.jirengu.com上展示一个图片,需要怎么操作?

    首先利用图床工具把本地图片上传到网络上


    上传至图床

    然后把图片生成的外部链写进HTML中就可以展示了


    图片应用

    列出5条以上html和 css 的书写规范

    1、代码尽量用英文
    2、统一使用小写
    3、不加中杠和下划线
    4、尽量不要缩写,除非是一眼能看明白的词
    5、同一页面,应避免使用相同的 name 与 id

    截图介绍 chrome 开发者工具的功能区

    ChrChr

    相关文章

      网友评论

          本文标题:CSS基础

          本文链接:https://www.haomeiwen.com/subject/tmdstxtx.html