为了账号安全,请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
初识HTML(5)+CSS(3)_学习笔记_慕课网
为了账号安全,请及时绑定邮箱和手机立即绑定

初识HTML(5)+CSS(3)

五月的夏天 Web前端工程师
难度入门
时长 9小时18分
  • 继承 CSS的某些样式是具有继承性的 一些css样式是不具有继承性的 如border:1px solid red;代码的作用只是给p标签设置了边框为1像素、红色、实心边框线
    查看全部
  • 分组选择符 h1、span标签同时设置字体颜色为红色: h1,span{color:red;}
    查看全部
  • 伪类选择符 给html中一个标签元素的鼠标滑过的状态来设置字体颜色 a:hover{color:red;} 现在比较常用的还是a:hover的组合
    查看全部
  • 通用选择器 通用选择器是功能最强大的选择器,它使用一个(*)号指定,它的作用是匹配html中所有标签元素 如下使用下面代码使用html中任意标签元素字体颜色全部设置为红色 * {color:red;}
    查看全部
  • 包含(后代)选择器 包含选择器,即加入空格,用于选择指定标签元素下的后辈元素 >作用于元素的第一代后代,空格作用于元素的所有后代 .first span{color:red;}
    查看全部
  • 子选择器 还有一个比较有用的选择器子选择器,即大于符号(>),用于选择指定标签元素的第一代子元素 .food>li{border:1px solid red;} <ul class="food"> <li>水果 <ul> <li>香蕉</li> <li>苹果</li> <li>梨</li> </ul> </li>
    查看全部
  • 内联元素特点: 1、和其他元素都在一行上; 2、元素的高度、宽度、行高及顶部和底部边距不可设置; 3、元素的宽度就是它包含的文字或图片的宽度,不可改变。 解决行内元素间隙bug问题 行内元素之间会产生间隙bug问题的场景: 1、当行内元素之间有“回车”、“tab”、“空格”时就会出现间隙。 解决方法: 1、写在一行,之间不要有空格之类的符号。 2、使用font-size:0
    查看全部
  • 类和ID选择器的区别 1、ID选择器只能在文档中使用一次。 2、可以使用类选择器词列表方法为一个元素同时设置多个样式。
    查看全部
  • ID选择器 选择器都类似于类选择符,但也有一些重要的区别: 1、为标签设置id="ID名称",而不是class="类名称"。 2、ID选择符的前面是井号(#)号,而不是英文圆点(.)。
    查看全部
    0 采集 收起

    2018-03-22

  • 类选择器 .类选器名称{css样式代码;} 1、英文圆点开头 2、其中类选器名称可以任意起名(但不要起中文噢) <span class="stress">胆小如鼠</span> .setGreen{ color:green;}
    查看全部
  • 标签选择器<html>、<body>、<h1>、<p>、<img> p{font-size:12px;line-height:1.6em;}为p标签设置12px字号,行间距设置1.6em的样式
    查看全部
  • fwf
    ID选择器: 1、为标签设置id="ID名称"。 2、ID选择符的前面是井号(#)号。
    查看全部
    0 采集 收起

    2018-03-22

  • Relative与Absolute组合使用 小伙伴们学习了12-6小节的相对定位的方法:使用position:absolute可以实现被设置元素相对于浏览器(body)设置定位以后,大家有没有想过可不可以相对于其它元素进行定位呢?答案是肯定的,当然可以。使用position:relative来帮忙,但是必须遵守下面规范: 1、参照定位的元素必须是相对定位元素的前辈元素: <div id="box1"><!--参照定位的元素--> <div id="box2">相对参照元素进行定位</div><!--相对定位元素--> </div> 从上面代码可以看出box1是box2的父元素(父元素当然也是前辈元素了)。 2、参照定位的元素必须加入position:relative; #box1{ width:200px; height:200px; position:relative; } 3、定位元素加入position:absolute,便可以使用top、bottom、left、right来进行偏移定位了。 #box2{ position:absolute; top:20px; left:30px; } 这样box2就可以相对于父元素box1定位了(这里注意参照物就可以不是浏览器了,而可以自由设置了)。
    查看全部
  • fwf
    css样式: 选择器{ 样式; } 在{}之前的部分就是“选择器”,“选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元素。
    查看全部
  • fwf
    三种样式的优先级:内联式 > 嵌入式 > 外部式 注:1、嵌入式>外部式有一个前提——嵌入式css样式的位置一定在外部式的后面。<link href="style.css" ...>代码在<style type="text/css">...</style>代码的前面。 2、就近原则:离被设置元素越近优先级别越高)。
    查看全部
    0 采集 收起

    2018-03-22

举报

0/150
提交
取消
课程须知
没有任何WEB经验的WEB应用程序开发者、对WEB前端技术感兴趣的用户均可学习本教程。
老师告诉你能学到什么?
本教程代领大家轻松学习HTML(5)、CSS(3)样式基础知识,可以利用HTML(5)、CSS(3)样式技术制作出简单页面。
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!