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

初识HTML(5)+CSS(3)

五月的夏天 Web前端工程师
难度入门
时长 9小时18分
最热 最新
  • 周公子喵
    流动（Flow）是默认的网页布局模式。 第一点，块状元素都会在所处的包含元素内自上而下按顺序垂直延伸分布， 在默认状态下，块状元素的宽度都为100% 块状元素都会以行的形式占据位置。
    查看全部
    0 采集 收起 来源：排队显示-流动模型（一）

    2015-01-08

  • 天心凉
    margin 外填充 margin-left margin-right margin-top margin-bottom
    查看全部
    0 采集 收起 来源：距离产生美 - 使用margin为盒子设置外边距（边界）

    2015-01-06

  • 天心凉
    padding 内填充 padding-left padding-right padding-top padding-bottom
    查看全部
    0 采集 收起 来源：宰相肚里能撑船 - 使用padding为盒子设置内边距（填充）

    2015-01-06

  • 周公子喵
    在网页中，元素有三种布局模型： 1、流动模型（Flow） 2、浮动模型 (Float) 3、层模型（Layer）
    查看全部
    0 采集 收起 来源：CSS3的布局 - css布局模型

    2015-01-06

  • 周公子喵
    边界（margin）：边界也是可分为上、右、下、左 可以是和另一个盒子的距离，也可以是和浏览器的距离
    查看全部
    0 采集 收起 来源：距离产生美 - 使用margin为盒子设置外边距（边界）

    2015-01-06

  • virgil_rey
    层模型--固定定位： fixed：表示固定定位，与absolute定位类型类似，但它的相对移动的坐标是视图（屏幕内的网页窗口）本身。由于视图本身是固定的，它不会随浏览器窗口的滚动条滚动而变化，除非你在屏幕中移动浏览器窗口的屏幕位置，或改变浏览器窗口的显示大小，因此固定定位的元素会始终位于浏览器窗口内视图的某个位置，不会受文档流动影响，这与background-attachment:fixed;属性功能相同。
    查看全部
    0 采集 收起 来源：我就在那不动了-层模型之固定定位

    2015-01-06

  • felix00
    特殊性 有的时候我们为同一个元素设置了不同的CSS样式代码，那么元素会启用哪一个CSS样式呢?我们来看一下面的代码： p{color:red;} .first{color:green;} <p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩。</p> p和.first都匹配到了p这个标签上，那么会显示哪种颜色呢？green是正确的颜色，那么为什么呢？是因为浏览器是根据权值来判断使用哪种css样式的，权值高的就使用哪种css样式。 下面是权值的规则： 标签的权值为1，类选择符的权值为10，ID选择符的权值最高为100。例如下面的代码： p{color:red;} /*权值为1*/ p span{color:green;} /*权值为1+1=2*/ .warning{color:white;} /*权值为10*/ p span.warning{color:purple;} /*权值为1+1+10=12*/ #footer .note p{color:yellow;} /*权值为100+10+1=111*/ 注意：还有一个权值比较特殊--继承也有权值但很低，有的文献提出它只有0.1，所以可以理解为继承的权值最低
    查看全部
    0 采集 收起 来源：权值计算-特殊性

    2018-03-22

  • felix00
    层叠 我们来思考一个问题：如果在html文件中对于同一个元素可以有多个css样式存在并且这多个css样式具有相同权重值怎么办？好，这一小节中的层叠帮你解决这个问题。 层叠就是在html文件中对于同一个元素可以有多个css样式存在，当有相同权重的样式存在时，会根据这些css样式的前后顺序来决定，处于最后面的css样式会被应用。 如下面代码: p{color:red;} p{color:green;} <p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩。</p> 最后 p 中的文本会设置为green，这个层叠很好理解，理解为后面的样式会覆盖前面的样式。 所以前面的css样式优先级就不难理解了： 内联样式表（标签内部）> 嵌入样式表（当前文件中）> 外部样式表（外部文件中）。
    查看全部
    0 采集 收起

    2018-03-22

  • virgil_rey
    层模型--相对定位: 如果想为元素设置层模型中的相对定位，需要设置position:relative（表示相对定位），它通过left、right、top、bottom属性确定元素在正常文档流中的偏移位置。相对定位完成的过程是首先按static(float)方式生成一个元素(并且元素像层一样浮动了起来)，然后相对于以前的位置移动，移动的方向和幅度由left、right、top、bottom属性确定，偏移前的位置保留不动。
    查看全部
    0 采集 收起 来源：相对于自己的位置-层模型之相对定位

    2015-01-06

  • 周公子喵
    填充距离（padding）：填充也可分为上、右、下、左(顺时针)
    查看全部
    0 采集 收起 来源：宰相肚里能撑船 - 使用padding为盒子设置内边距（填充）

    2015-01-06

  • felix00
    重要性 我们在做网页代码的时，有些特殊的情况需要为某些样式设置具有最高权值，怎么办？这时候我们可以使用!important来解决。 如下代码： p{color:red!important;} p{color:green;} <p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩。</p> 这时 p 段落中的文本会显示的red红色。 注意：!important要写在分号的前面 这里注意当网页制作者不设置css样式时，浏览器会按照自己的一套样式来显示网页。并且用户也可以在浏览器中设置自己习惯的样式，比如有的用户习惯把字号设置为大一些，使其查看网页的文本更加清楚。这时注意样式优先级为：浏览器默认的样式 < 网页制作者样式 < 用户自己设置的样式，但记住!important优先级样式是个例外，权值高于用户自己设置的样式。
    查看全部
    0 采集 收起 来源：为所欲为 - 选择器最高层级!important

    2018-03-22

  • virgil_rey
    层模型--绝对定位： 如果想为元素设置层模型中的绝对定位，需要设置position:absolute(表示绝对定位)，这条语句的作用将元素从文档流中拖出来，然后使用left、right、top、bottom属性相对于其最接近的一个具有定位属性的父包含块进行绝对定位。如果不存在这样的包含块，则相对于body元素，即相对于浏览器窗口。
    查看全部
    0 采集 收起 来源：万事无绝对 -层模型之绝对定位

    2015-01-06

  • fullee
    <br />  http://www.mooc.cn/news/2148.html
    查看全部
    0 采集 收起 来源：再来一个水平分割线 - 使用<hr>标签实现水平线标签

    2018-03-22

  • yumuchen8
    子选择器 还有一个比较有用的选择器子选择器，即大于符号(>),用于选择指定标签元素的第一代子元素。如右侧代码编辑器中的代码： .food>li{border:1px solid red;} 这行代码会使class名为food下的子元素li（水果、蔬菜）加入红色实线边框。
    查看全部
    7 采集 收起 来源：捡了一个儿子 - 子选择器

    2018-03-22

  • 周公子喵
    只设置一个方位的边框： border-top：1px dotted red； border-bottom：1px dashed red； border-left：1px solid red； border-right：1px dotted red；
    查看全部
    0 采集 收起 来源：我想脚下踩条线 - 使用border为盒子添加边框（二）

    2015-01-06

首页上一页27020270212702227023270242702527026下一页尾页

举报

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

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

查看已购买的课程