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

初识HTML(5)+CSS(3)

五月的夏天 Web前端工程师
难度入门
时长 9小时18分
  • 文字排版--下划线 有些情况下想为文字设置为下划线样式,这样可以在视觉上强调文字,可以使用下面代码来实现: p a{text-decoration:underline;}
    查看全部
    0 采集 收起

    2015-02-11

  • 文字排版--斜体 以下代码可以实现文字以斜体样式在浏览器中显示: p a{font-style:italic;}
    查看全部
  • 文字排版--粗体 我们还可以使用css样式来改变文字的样式:粗体、斜体、下划线、删除线,可以使用下面代码实现设置文字以粗体样式显示出来。 p span{font-weight:bold;} 在这里大家可以看到,如果想为文字设置粗体是有单独的css样式来实现的,再不用为了实现粗体样式而使用h1-h6或strong标签了。
    查看全部
  • 文字排版--字号、颜色 可以使用下面代码设置网页中文字的字号为12像素,并把字体颜色设置为#666(灰色): body{font-size:12px;color:#666}
    查看全部
  • 文字排版--字体 我们可以使用css样式为网页中的文字设置字体、字号、颜色等样式属性。下面我们来看一个例子,下面代码实现:为网页中的文字设置字体为宋体。 body{font-family:"宋体";} 这里注意不要设置不常用的字体,因为如果用户本地电脑上如果没有安装你设置的字体,就会显示浏览器默认的字体。(因为用户是否可以看到你设置的字体样式取决于用户本地电脑上是否安装你设置的字体。) 现在一般网页喜欢设置“微软雅黑”,如下代码: body{font-family:"Microsoft Yahei";} 或 body{font-family:"微软雅黑";} 注意:第一种方法比第二种方法兼容性更好一些。 因为这种字体即美观又可以在客户端安全的显示出来(用户本地一般都是默认安装的)。
    查看全部
  • 我们在做网页代码的时,有些特殊的情况需要为某些样式设置具有最高权值,怎么办?这时候我们可以使用!important来解决。 如下代码: p{color:red!important;} p{color:green;} 注意:!important要写在分号的前面 注意样式优先级为:浏览器默认的样式 < 网页制作者样式 < 用户自己设置的样式,但记住!important优先级样式是个例外,权值高于用户自己设置的样式。
    查看全部
  • 层叠就是在html文件中对于同一个元素可以有多个css样式存在,当有相同权重的样式存在时,会根据这些css样式的前后顺序来决定,处于最后面的css样式会被应用。 css样式优先级: 内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中)。
    查看全部
    0 采集 收起

    2018-03-22

  • CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代。比如下面代码:如某种颜色应用于p标签,这个颜色设置不仅应用p标签,还应用于p标签中的所有子元素文本,这里子元素为span标签。 p{color:red;} <p>三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p> 可见右侧结果窗口中p中的文本与span中的文本都设置为了红色。但注意有一些css样式是不具有继承性的。如border:1px solid red; p{border:1px solid red;} <p>三年级时,我还是一个<span>胆小如鼠</span>的小女孩。</p> 在上面例子中它代码的作用只是给p标签设置了边框为1像素、红色、实心边框线,而对于子元素span是没用起到作用的 不可继承的属性::display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、left、right、top、 bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、 page-bread-before和unicode-bidi...
    查看全部
  • 盒子模型 内填充 padding 框内到内容距离 外边距 margin 两个盒子模型的距离 边框 border 都有四个方向
    查看全部
  • h1,span{color:red;} 它相当于下面两行代码: h1{color:red;} span{color:red;}
    查看全部
  • 外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在<head>内(不是在<style>标签内)使用<link>标签将css样式文件链接到HTML文件内,如下面代码: <link href="base.css" rel="stylesheet" type="text/css" />
    查看全部
    0 采集 收起

    2018-03-22

  • 伪类选择符,它允许给html不存在的标签(标签的某种状态)设置样式,比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色: a:hover{color:red;} 其实 :hover 可以放在任意的标签上,比如说 p:hover,但是它们的兼容性也是很不好的,所以现在比较常用的还是 a:hover 的组合。
    查看全部
  • 通用选择器是功能最强大的选择器,它使用一个(*)号指定,它的作用是匹配html中所有标签元素,如下使用下面代码使用html中任意标签元素字体颜色全部设置为红色 * {color:red; font-size:20px; }
    查看全部
  • 包含(后代)选择器 .first span{color:red;} 请注意这个选择器与子选择器的区别,子选择器(child selector)仅是指它的直接后代,或者你可以理解为作用于子元素的第一代后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择,而子选择器是通过“>”进行选择。 总结:>作用于元素的第一代后代,空格作用于元素的所有后代。
    查看全部
  • css最后一条声明可以没有分号,但是为了以后修改方便,一般也加上分号。
    查看全部

举报

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

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