专栏首页一番码客前端基础-CSS基础(五)

前端基础-CSS基础(五)

本文目录

继承

层叠命名规范参考

继承
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>继承</title>
        <style>
            div{
                color: red;
                border: #0000ff 1px solid;
            }

            p{
                border: #0000ff 1px solid;
            }
        </style>
    </head>
    <body>
        asdfafd   asdffd
        <div>
            asdfadf asdfasdf
            <span>asdfasdf</span>
            <span>asdfasdf</span>
            <p>这是一个p标签</p>
        </div>
        asdfa asdffadf

    </body>
</html>
  • 父元素定义了样式,子元素也使用了对应的样式,这叫做继承。
  • 并不是所有样式都可以被继承,例如border属性。
  • 页面的布局都是CSS+DIV实现的。
    • p标签前后的内容会换行。
    • div标签前后的内容会换行;是一个容器,不会改变里面内容的样式;可以放入任何的标签/ 的内容。
    • span标签也是容器,一般放入的内容:文本/ a标签,前后的内容不会换行。

层叠

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            p{
                color: blue;
                font-size: 50px;
            }
        </style>
    </head>
    <body>
        <p style="color: red;">这是一个段落</p>
    </body>
</html>
  • 对同一个内容指定了多种样式,如果样式是不一样的,就叠加生效;如果样式是一样的,就按照就近原则。

命名规范

  • 采用英文字母,数字,中划线,下划线命名,但不建议使用下划线;
  • 以英文字母开头,不能以数字、中划线、下划线开头;
  • 一个单词时,全部使用小写;
  • 多个单词时,可以使用驼峰命名,或使用中划线、下划线分割单词;
  • 命名时,尽量有意义;
  • 不要随意使用id;
  • 不要随意使用缩写,除非时常用的。

参考

  • 黑马程序员 120天全栈区块链开发 开源教程 https://github.com/itheima1/BlockChain

本文分享自微信公众号 - 一番码客(efonfighting),作者:Efonfighting

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-12-11

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 前端基础-CSS基础(一)

    efonfighting
  • 前端基础-CSS基础(二)

    efonfighting
  • 前端基础-CSS基础(六)

    efonfighting
  • Day1:html和css

    浏览器内核:浏览器分两个部分,一个是渲染引擎(layout engineer 或者 Rendering Engine)和js引擎.

    达达前端
  • 工业互联网及其驱动的数字化转型

    首先我们可以看我们对未来的这个市场的一个总体的一个判断。在过去几年我们放眼过去,几年来看整个的话,首先全球经济呈现一个总体放缓的态势,包括投资和贸易都缺乏一些新...

    云大学小编
  • 一个完整的机器学习项目在Python中演练(四)

    磐创AI
  • 真实VS虚拟,虚拟现实如何定义

    如果说“客观物质”就代表真实,那我们如何去感知这些客观物质呢?中国有句古话叫“眼见为实”,是不是眼睛看到的就是真实的呢?科学家告诉我们,人类看到的、听到的、闻到...

    博文视点Broadview
  • iOS使用VOIP与CallKit实现体验优质的网络通讯功能

        VOIP是Apple提供给开发者的网络电话功能接口。简单来说,其可以让你的应用程序在完全杀死的情况下被服务端唤醒。CallKit是iOS10引入的新框架...

    珲少
  • 这个日本推出的逼真贴心“虚拟女友”,油管网友表示会看哭

    安妮 编译整理 量子位 报道 | 公众号 QbitAI 常见的智能助理几乎都用了女性的声音,但如果你想和她们谈个恋爱,多半后遭到拒绝。Siri、Cortana都...

    量子位
  • HDUOJ-----Difference Between Primes

    Difference Between Primes Time Limit: 2000/1000 MS (Java/Others)    Memory Limit...

    Gxjun

扫码关注云+社区

领取腾讯云代金券