iBoundary

摘要： 段落排版--对齐 想为块状元素中的文本、图片设置居中样式吗？可以使用text-align样式代码，如下代码可实现文本居中显示。 同样可以设置居左： 还可以设置居右： 实例： 阅读全文

摘要： 段落排版--中文字间距、字母间距 如果想在网页排版中设置文字间隔或者字母间隔就可以使用 letter-spacing 来实现，如下面代码： 注意：这个样式使用在英文单词时，是设置字母与字母之间的间距。 单词间距设置： 如果我想设置英文单词之间的间距呢？可以使用 word-spacing 来实现。如下 阅读全文

摘要： 段落排版--行间距（行高） 这一小节我们来学习一下另一个在段落排版中起重要作用的行间距（行高）属性（line-height），如下代码实现设置段落行间距为1.5倍。 实例： 阅读全文

摘要： 段落排版--缩进 中文文字中的段前习惯空两个文字的空白，这个特殊的样式可以用下面代码来实现： 注意：2em的意思就是文字的2倍大小。 阅读全文

摘要： 文字排版--删除线 如果想在网页上设置删除线怎么办，这个样式在电商网站上常会见到： 上图中的原价上的删除线使用下面代码就可以实现： 实例： 阅读全文

摘要： 文字排版--下划线 有些情况下想为文字设置为下划线样式，这样可以在视觉上强调文字，可以使用下面代码来实现： 实例： 阅读全文

摘要： 文字排版--斜体 以下代码可以实现文字以斜体样式在浏览器中显示： 阅读全文

摘要： 文字排版--粗体 我们还可以使用css样式来改变文字的样式：粗体、斜体、下划线、删除线，可以使用下面代码实现设置文字以粗体样式显示出来。 在这里大家可以看到，如果想为文字设置粗体是有单独的css样式来实现的，再不用为了实现粗体样式而使用h1-h6或strong标签了。 阅读全文

摘要： 文字排版--字体 我们可以使用css样式为网页中的文字设置字体、字号、颜色等样式属性。下面我们来看一个例子，下面代码实现：为网页中的文字设置字体为宋体。 这里注意不要设置不常用的字体，因为如果用户本地电脑上如果没有安装你设置的字体，就会显示浏览器默认的字体。（因为用户是否可以看到你设置的字体样式取决 阅读全文

摘要： 重要性 我们在做网页代码的时，有些特殊的情况需要为某些样式设置具有最高权值，怎么办？这时候我们可以使用!important来解决。 如下代码： 这时 p 段落中的文本会显示的red红色。 注意：!important要写在分号的前面 这里注意当网页制作者不设置css样式时，浏览器会按照自己的一套样式来 阅读全文

摘要： 层叠 我们来思考一个问题：如果在html文件中对于同一个元素可以有多个css样式存在并且这多个css样式具有相同权重值怎么办？好，这一小节中的层叠帮你解决这个问题。 层叠就是在html文件中对于同一个元素可以有多个css样式存在，当有相同权重的样式存在时，会根据这些css样式的前后顺序来决定，处于最 阅读全文

摘要： 特殊性 有的时候我们为同一个元素设置了不同的CSS样式代码，那么元素会启用哪一个CSS样式呢?我们来看一下面的代码： p和.first都匹配到了p这个标签上，那么会显示哪种颜色呢？green是正确的颜色，那么为什么呢？是因为浏览器是根据权值来判断使用哪种css样式的，权值高的就使用哪种css样式。 阅读全文

摘要： 继承 CSS的某些样式是具有继承性的，那么什么是继承呢？继承是一种规则，它允许样式不仅应用于某个特定html标签元素，而且应用于其后代。比如下面代码：如某种颜色应用于p标签，这个颜色设置不仅应用p标签，还应用于p标签中的所有子元素文本，这里子元素为span标签。 可见右侧结果窗口中p中的文本与spa 阅读全文

摘要： 分组选择符 当你想为html中多个标签元素设置同一个样式时，可以使用分组选择符（，），如下代码为右侧代码编辑器中的h1、span标签同时设置字体颜色为红色： 它相当于下面两行代码： 实例： 阅读全文

摘要： 伪类选择符 更有趣的是伪类选择符，为什么叫做伪类选择符，它允许给html不存在的标签（标签的某种状态）设置样式，比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色： <a href="address"> word </a> 地址标签 上面一行代码就是为 a 标签鼠标滑过的状态设置字体颜 阅读全文

摘要： 包含(后代)选择器 包含选择器，即加入空格,用于选择指定标签元素下的后辈元素。如右侧代码编辑器中的代码： 这行代码会使第一段文字内容中的“胆小如鼠”字体颜色变为红色。 请注意这个选择器与子选择器的区别，子选择器（child selector）仅是指它的直接后代，或者你可以理解为作用于子元素的第一代后 阅读全文

摘要： 子选择器 还有一个比较有用的选择器子选择器，即大于符号(>),用于选择指定标签元素的第一代子元素。如右侧代码编辑器中的代码： 这行代码会使class名为food下的子元素li（水果、蔬菜）加入红色实线边框。 阅读全文

摘要： 类和ID选择器的区别 学习了类选择器和ID选择器，我们会发现他们之间有很多的相似处，是不是两者可以通用呢？我们不要着急先来总结一下他们的相同点和不同点： 相同点：可以应用于任何元素不同点： 1、ID选择器只能在文档中使用一次。与类选择器不同，在一个HTML文档中，ID选择器只能使用一次，而且仅一次。 阅读全文