美文网首页Web前端之路Web 前端开发
技术 | Web前端开发(4)持续更新

技术 | Web前端开发(4)持续更新

作者: techLee | 来源:发表于2017-03-09 21:59 被阅读52次

    人死了,就变成一个星星,给走夜道的人照个亮儿

    CSS:

    css的三种引入方式:

    代码

    以上就是css的三种引入方式,分别是:

    1.行间样式:

    在标签里写入:style=""

    2.页面级css:

    在head标签里写入:<style type="text/css">在这中间写入css样式代码</style>

    3.外部css文件:

    这里就需要在html代码中引入css样式,通过:

    <link rel="stylesheet" href="这里写入css的文件的路径">

    以上就是css的三种引入方式。

    当然,常用的引入方式就是第三种外部引入css文件,这样就可以保证了html代码与css代码的分离,方便后期修改。

    选择器:

    1.id选择器:

    左侧的html代码,右侧为css代码 浏览器中显示,可以看到我把浏览器换成了chrome浏览器

    css代码中的#号为id选择器的唯一标识。

    id是什么的缩写?身份证的英文单词怎么写?IDcard?,姑且就这么认为吧。一个人不能有两个身份证吧?同样的道理,一个div标签里不能有两个id,同时也不能有两个一样的id。

    2.class选择器:

    class选择器的标识是一个点,在css代码中我们可以看到用点可以选择到class选择器上。同时class选择器,可以同时有两个名字,并且可以同时起到作用。

    看浏览器显示效果:

    第一行456是通过第一个class选择器控制的

    第二行的789是用过第二个选择器的两个名字控制的,一个名字控制了颜色,另一个名字控制了边框为黑色实线。

    3.标签选择器:

    这个选择器特别简单:

    这个选择器就是单纯的用标签来选择需要控制的html代码。标签叫什么名字,就写什么就可以了。

    看浏览器中的显示效果:

    4.通配符选择器:

    通配符选择器可以选择全局。看一下浏览器中的显示效果:

    我们发现整个浏览器都变成了黄色的,可是我们并没有选择整个浏览器啊,难道说浏览器喜欢黄啊?当然不是,通配符选择器是选择全局的标签,那么body同样是标签。所以全局的颜色都改变了。

    相关文章

      网友评论

        本文标题:技术 | Web前端开发(4)持续更新

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