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

初识HTML(5)+CSS(3)

五月的夏天 Web前端工程师
难度入门
时长 9小时18分
最热 最新
  • iamwyc
    绝对定位:相对于其最接近的一个具有定位属性的父包含块进行定位，如果不存在这样的包含块，则相对于body元素，即相对于浏览器窗口 相对定位:首先按static(float)方式生成一个元素(并且元素像层一样浮动了起来),相对于自身原来的位置，而不是像绝对定位那样相对父级块元素!
    查看全部
    0 采集 收起 来源：相对于自己的位置-层模型之相对定位

    2015-02-21

  • 隨淅
    区别这种选择器！！！！！！！！！！！ 包含(后代)选择器 包含选择器，即加入空格,用于选择指定标签元素下的后辈元素。如右侧代码编辑器中的代码： .first span{color:red;} 这行代码会使第一段文字内容中的“胆小如鼠”字体颜色请注意这个选择器与子选择器的区别，子选择器（child selector）仅是指它的直接后代，或者你可以理解为作用于子元素的第一代后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择，而子选择器是通过“>”进行选择。 总结：>作用于元素的第一代后代，空格作用于元素的所有后代。
    查看全部
    0 采集 收起 来源：这么快就当爷爷了? - 后代选择器

    2018-03-22

  • 隨淅
    很重要！！！子选择器
    查看全部
    0 采集 收起 来源：捡了一个儿子 - 子选择器

    2015-02-21

  • 隨淅
    语法： .类选器名称{css样式代码;} 注意： 1、英文圆点开头 2、其中类选器名称可以任意起名（但不要起中文噢） 使用方法： 第一步：使用合适的标签把要修饰的内容标记起来，如下： <span>胆小如鼠</span> 第二步：使用class="类选择器名称"为标签设置一个类，如下： <span class="stress">胆小如鼠</span> 第三步：设置类选器css样式，如下： .stress{color:red;}/*类前面要加入一个英文圆点*/
    查看全部
    0 采集 收起 来源：再选一个类 - 类选择器

    2018-03-22

  • 金藤藤
    长度值 长度单位总结一下，目前比较常用到px（像素）、em、% 百分比，要注意其实这三种单位都是相对单位。 1、像素 像素为什么是相对单位呢？因为像素指的是显示器上的小点（CSS规范中假设“90像素=1英寸”）。实际情况是浏览器会使用显示器的实际像素值有关，在目前大多数的设计者都倾向于使用像素（px）作为单位。 2、em 就是本元素给定字体的 font-size 值，如果元素的 font-size 为 14px ，那么 1em = 14px；如果 font-size 为 18px，那么 1em = 18px。如下代码： p{font-size:12px;text-indent:2em;} 上面代码就是可以实现段落首行缩进 24px（也就是两个字体大小的距离）。 下面注意一个特殊情况： 但当给 font-size 设置单位为 em 时，此时计算的标准以 p 的父元素的 font-size 为基础。如下代码： html: <p>以这个<span>例子</span>为例。</p> css: p{font-size:14px} span{font-size:0.8em;} 结果 span 中的字体“例子”字体大小就为 11.2px（14 * 0.8 = 11.2px）。 3、百分比 p{font-size:12px;line-height:130%} 设置行高（行间距）为字体的130%（12 * 1.3 = 15.6px）。
    查看全部
    0 采集 收起

    2018-03-22

  • 金藤藤
    字体缩写 网页中的字体css样式代码也有他自己的缩写方式，下面是给网页设置字体的代码： body{ font-style:italic; font-variant:small-caps; font-weight:bold; font-size:12px; line-height:1.5em; font-family:"宋体",sans-serif; } 这么多行的代码其实可以缩写为一句： body{ font:italic small-caps bold 12px/1.5em "宋体",sans-serif; } 注意： 1、使用这一简写方式你至少要指定 font-size 和 font-family 属性，其他的属性(如 font-weight、font-style、font-varient、line-height)如未指定将自动使用默认值。 2、在缩写时 font-size 与 line-height 中间要加入“/”斜扛。 一般情况下因为对于中文网站，英文还是比较少的，所以下面缩写代码比较常用： body{ font:12px/1.5em "宋体",sans-serif; } 只是有字号、行间距、中文字体、英文字体设置。
    查看全部
    0 采集 收起

    2018-03-22

  • 金藤藤
    还记得在讲盒模型时外边距(margin)、内边距(padding)和边框(border)设置上下左右四个方向的边距是按照顺时针方向设置的：上右下左。具体应用在margin和padding的例子如下： margin:10px 15px 12px 14px;/*上设置为10px、右设置为15px、下设置为12px、左设置为14px*/ 通常有下面三种缩写方法: 1、如果top、right、bottom、left的值相同，如下面代码： margin:10px 10px 10px 10px; 可缩写为： margin:10px; 2、如果top和bottom值相同、left和 right的值相同，如下面代码： margin:10px 20px 10px 20px; 可缩写为： margin:10px 20px; 3、如果left和right的值相同，如下面代码： margin:10px 20px 30px 20px; 可缩写为： margin:10px 20px 30px; 注意：padding、border的缩写方法和margin是一致的。
    查看全部
    0 采集 收起

    2015-02-21

  • 金藤藤
    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定位了（这里注意参照物就可以不是浏览器了，而可以自由设置了）。
    查看全部
    0 采集 收起 来源：Relative与Absolute组合使用

    2018-03-22

  • iamwyc
    网页的三种定位方式： 1.流动型(flow) 默认的网页布局模式 2.浮动型(float) 可以使块级元素处在同一行 3.层模型(layer) ①.绝对定位(position:absolute) ②.相对定位(position:relative) ③.固定定位(position:fixed)
    查看全部
    0 采集 收起 来源：什么是层模型？

    2015-02-21

  • iamwyc
    在网页中，元素有三种布局模型: 1.流动模型(flow) 2.浮动模型(float) 3.层模型(layer)
    查看全部
    0 采集 收起 来源：CSS3的布局 - css布局模型

    2015-02-21

  • iamwyc
    块状元素: 1.所有元素都在新的一行 2.高度，宽度，行高，顶和底边间距都可以设置 3.元素宽度在不设置的情况下与父级同宽 内联元素: 1.所有的元素都在同一行 2.高度，宽度，行高，顶和底边间距不可设置 3.元素的宽度由内部的文字或者图片决定 内联块状元素:1.所有元素都在同一行 2.高度，宽度，行高，顶和底部间距可以设置
    查看全部
    0 采集 收起 来源：我还要站个大位置 - 内联块状元素

    2015-02-21

  • Sunnyshine
    总的来说ul标签里面是没有数字的，而ol标签里面是有数字的
    查看全部
    0 采集 收起

    2015-02-21

  • iamwyc
    块级元素: 每个块级元素都从新的一行开始；元素的高度，宽度，行高以及顶和底边距都可设置；元素的宽度在不设置的情况下与父级宽度一样 内联元素: 所有元素都在一行上；元素的高度，宽度，行高及顶部和底部边距不可设置；元素的宽度就是它包含的文字或图片的宽度，不可改变 内联元素间有个间距问题!
    查看全部
    0 采集 收起 来源：我要和你站一起 - 内联元素

    2015-02-21

  • iamwyc
    常用的块状元素有： <div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form> 常用的内联元素有： <a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code> 常用的内联块状元素有： <img>、<input>
    查看全部
    0 采集 收起 来源：给元素分个类 - 元素分类

    2018-03-22

  • iamwyc
    letter-spacing 可以设置中文字，这个样式使用在英文单词时，是设置字母与字母之间的间距。 word-spacing 这个样式是设置英文单词之间的间距
    查看全部
    0 采集 收起

    2015-02-21

首页上一页26418264192642026421264222642326424下一页尾页

举报

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

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

查看已购买的课程