慕课网

精品课程初识HTML(5)+CSS(3)

初识HTML(5)+CSS(3)

最热最新

龙腾617

伪类选择符允许给html不存在的标签（标签的某种状态）设置样式，比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色： a:hover{color:red;} 上面一行代码就是为a标签鼠标滑过的状态设置字体颜色变红。

查看全部

0 采集收起来源：伪装者 - 伪类选择器
2014-11-18
摩羯座_小贱

元素分类--内联元素在html中，<span>、<a>、<label>、<input>、 <img>、 <strong> 和<em>就是典型的内联元素（行内元素）（inline）元素。当然块状元素也可以通过代码display:inline将元素设置为内联元素。如下代码就是将块状元素div转换为内联元素，从页使用div元素具有内联元素特点。内联元素特点： 1、和其他元素都在一行上； 2、元素的高度、宽度、行高及顶部和底部边距不可设置； 3、元素的宽度就是它包含的文字或图片的宽度，不可改变。小伙伴们你们观查一下右侧代码段，有没有发现一个问题，内联元素之间有一个间距问题，这个问题在本小节的wiki中有介绍，感兴趣的小伙伴可以去查看。

查看全部

0 采集收起来源：我要和你站一起 - 内联元素
2018-03-22
摩羯座_小贱

元素分类--块级元素什么是块级元素？在html中<div>、 <p>、<h1>、<form>、<ul> 和 <li>就是块级元素。设置display:block就是将元素显示为块级元素。如下代码就是将内联元素a转换为块状元素，从而使a元素具有块状元素特点。 a{display:block;} 块级元素特点： 1、每个块级元素都从新的一行开始，并且其后的元素也另起一行。（真霸道，一个块级元素独占一行） 2、元素的高度、宽度、行高以及顶和底边距都可设置。 3、元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。

查看全部

0 采集收起来源：我要独占一行 - 块级元素
2018-03-22
珂茶婆

第一步：把这三个短语用<span></span>括起来。第二步：写入下列代码： span{ color:red; }

查看全部

0 采集收起来源：为什么是css呢? - CSS样式的优势
2018-03-22
奔跑的Q丶

每一条css样式定义由两部分组成，形式如下：选择器{样式;}。在{}之前的部分就是“选择器”，“选择器”指明了{}中的“样式”的作用对象，也就是“样式”作用于网页中的哪些元素。 1、标签选择器其实就是html代码中的标签。 2、类选择器语法：.类选器名称{css样式代码;} 3、ID选择器：在很多方面，ID选择器都类似于类选择符，但也有一些重要的区别：a、为标签设置id="ID名称"，而不是class="类名称"。b、ID选择符的前面是井号（#）号，而不是英文圆点（.）。 2|3、类和ID选择器的区别：相同点：可以应用于任何元素。不同点：a、ID选择器只能在文档中使用一次。b、可以使用类选择器词列表方法为一个元素同时设置多个样式。 4、子选择器：即大于符号(>),用于选择指定标签元素的第一代子元素。 5、包含（后代）选择器：包含选择器，即加入空格,用于选择指定标签元素下的后辈元素。 4|5、包含选择器与子选择器的区别：子选择器（child selector）仅是指它的直接后代，或者你可以理解为作用于子元素的第一代后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择，而子选择器是通过“>”进行选择。总结：>作用于元素的第一代后代，空格作用于元素的所有后代。 6、通用选择器：通用选择器是功能最强大的选择器，它使用一个（*）号指定，它的作用是匹配html中所有标签元素。 7、伪类选择器：关于伪类选择符，到目前为止，可以兼容所有浏鉴器的“伪类选择符”就是a标签上使用：hover了（其实伪类选择符还有很多，尤其是css3中，但是因为不能兼容所有浏鉴器，本教程只是讲了这一种最常用的）。其实:hover可以放在任意的标签上，比如说p:hover，但是它们的兼容性也是很不好的，所以现在比较常用的还是a:hover的组合。 8、分组选择符：当你想为html中多个标签元素设置同一个样式时，可以使用分组选择符（，）。

查看全部

0 采集收起来源：css3的游戏规则 - 什么是选择器？
2018-03-22
骑着猫流浪

label标签：将标签中的文字变成鼠标可以点击的控件当用户单击该label标签时浏览器就会把焦点转到和标签相关的表单控件上： for:控件的id名称

查看全部

0 采集收起来源：使用label为input标签穿上衣服
2014-11-18
芥末1033786

<pre>语言代码段</pre> <pre> 标签的主要作用:预格式化文本。被包围在 pre 元素中的文本通常会保留空格和换行符

查看全部

0 采集收起
2018-03-22
摩羯座_小贱

素分类在讲解CSS布局之前，我们需要提前知道一些知识，在CSS中，html中的标签元素大体被分为三种不同的类型：块状元素、内联元素(又叫行内元素)和内联块状元素。常用的块状元素有： <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
骑着猫流浪

按钮在input标签中定义： type：设置类型 value：按钮上显示的文字 name：命名

查看全部

0 采集收起来源：填完就可以提交咯 - 提交按钮
2014-11-18
摩羯座_小贱

段落排版--对齐想为块状元素中的文本、图片设置居中样式吗？可以使用text-align样式代码，如下代码可实现文本居中显示。(那么什么是块状元素呢？在后面的11-1、11-2小节中会讲到。) h1{ text-align:center; } <h1>了不起的盖茨比</h1> 同样可以设置居左： h1{ text-align:left; } <h1>了不起的盖茨比</h1> 还可以设置居右： h1{ text-align:right; } <h1>了不起的盖茨比</h1>

查看全部

0 采集收起
2018-03-22
摩羯座_小贱

段落排版--字间距、字母间距文字间隔、字母间隔设置：如果想在网页排版中设置文字间隔或者字母间隔就可以使用 letter-spacing来实现，如下面代码： h1{ letter-spacing:50px; } ... <h1>了不起的盖茨比</h1> 注意：这个样式使用在英文单词时，是设置字母与字母之间的间距。单词间距设置：如果我想设置英文单词之间的间距呢？可以使用word-spacing来实现。如下代码： h1{ word-spacing:50px; } ... <h1>welcome to imooc!</h1>

查看全部

0 采集收起
2018-03-22
笑笑笑昂

如果想为元素设置层模型中的相对定位，需要设置position:relative（表示相对定位），它通过left、right、top、bottom属性确定元素在正常文档流中的偏移位置。相对定位完成的过程是首先按static(float)方式生成一个元素(并且元素像层一样浮动了起来)，然后相对于以前的位置移动，移动的方向和幅度由left、right、top、bottom属性确定，偏移前的位置保留不动。后面的元素还是按照前面元素偏移前的位置固定虽然div元素相对于以前的位置产生了偏移，但是div元素以前的位置还是保留着，所以后面的span元素是显示在了div元素以前位置的后面。

查看全部

0 采集收起来源：相对于自己的位置-层模型之相对定位
2014-11-18
龙腾617

通用选择器通用选择器是功能最强大的选择器，它使用一个（*）号指定，它的作用是匹配html中所有标签元素，如下使用下面代码使用html中任意标签元素字体颜色全部设置为红色： * {color:red;}

查看全部

0 采集收起来源：我全都要 - 通用选择器
2014-11-18
摩羯座_小贱

行间距属性（line-height）如下代码实现设置段落行间距为1.5倍:p{line-height:1.5em;}

查看全部

0 采集收起
2014-11-18
龙腾617

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

查看全部

0 采集收起来源：这么快就当爷爷了? - 后代选择器
2018-03-22

首页上一页 27618 27619 27620 27621 27622 27623 27624 下一页尾页

0/150

提交

取消

开始学习

课程须知: 没有任何WEB经验的WEB应用程序开发者、对WEB前端技术感兴趣的用户均可学习本教程。

老师告诉你能学到什么？: 本教程代领大家轻松学习HTML(5)、CSS(3)样式基础知识，可以利用HTML(5)、CSS(3)样式技术制作出简单页面。