Day.01.02 css之id选择器简单案例

挂树上的骷髅怪IP属地: 山东
字数 50
<!DOCTYPE html>
<html>
 <head>
 <meta  charset="utf-8">
  <title> 类选择器 </title>
    <style type="text/css">
    /*基本语法
    .类选择器名称{
        css属性:属性值;
    }
    补充:选择器名称命名规范:小写字母 .xxx-yyy{}
    */
        .span-news{
            font-weight:bold;/*粗体*/
            background-color:pink;
            color:black;
        }
    /*基本语法
    #id选择器名称{
        css属性:属性值;
    }
    */
        #span-news-tb{
            font-weight:bold;
            font-size:25px;/*字体大小*/
            background-color:pink;
        }
    </style>
 </head>
 <body>
    <span class="span-news">标题一</span>
    <span class="span-news">标题一</span>
    <span class="span-news">标题一</span>
    <span class="span-news">标题一</span>
    <span class="span-news">标题一</span>
    <hr>
    <span id="span-news-tb">这是一个冬天</span>
 </body>
</html>

细节:1.一般来说id选择器提供给某一个html元素来使用
2.当我们不确定,有多个html元素来使用该样式时,使用类选择器

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
0人点赞
挂树上的骷髅怪真正的自由不是你想做什么就做什么 ...
总资产1共写了9642字获得67个赞共84个粉丝

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,825评论 1 92
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,026评论 19 139
  • CSS基础 本文包括CSS基础知识选择器(重要!!!)继承、特殊性、层叠、重要性CSS格式化排版单位和值盒模型浮动...
    廖少少阅读 3,240评论 0 40
  • 考完英语期末考后,跟朋友说,看一部电影之后去图书馆,最后点开的却是《奶酪陷阱》。其实,这部剧我在上一个寒假就追完了...
    白菜是世界上最好的菜阅读 353评论 0 0
  • 我不知,我该如何敲下这些文字。 一秒钟前,我甚至不知道,我会写关于“你”。 我对你说,我好心疼自己。 你回我,傻嘉...
    心途行者噶玛梅朵阅读 407评论 2 3