慕课网

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

初识HTML(5)+CSS(3)

最热最新

洛雪

css内定义的宽（width）和高（height），指的是填充以里的内容范围。一个元素实际宽度（盒子的宽度）=左边界+左边框+左填充+内容宽度+右填充+右边框+右边界。

查看全部

0 采集收起来源：长胖长高点--宽度和高度
2015-01-30
小智仔

在网页中加入空格  别忘了分号~

查看全部

0 采集收起来源：再加点空格呢 - 使用特殊字符 实现空格标签
2018-03-22
逆水寒al

使用<pre>标签为你的网页加入大段代码在上节中介绍加入一行代码的标签为<code>，但是在大多数情况下是需要加入大段代码的，如下图：怎么办？不会是每一代码都加入一个<code>标签吧，没有这么复杂，这时候就可以使用<pre>标签。语法： <pre>语言代码段</pre> <pre> 标签的主要作用:预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。如下代码： <pre> var message="欢迎"; for(var i=1;i<=10;i++) { alert(message); } </pre> 在浏览器中的显示结果为：在上面的例子中可以看到代码中的空格，换行符都保留下来。如果用以前的方法，回车需要输入<br>签，空格需要输入  注意：<pre> 标签不只是为显示计算机的源代码时用的，在你需要在网页中预显示格式时都可以使用它，只是<pre>标签的一个常见应用就是用来展示计算机的源代码。

查看全部

0 采集收起
2018-03-22
逆水寒al

想加入一行代码吗？使用<code>标签在介绍语言技术的网站中，必免不了在网页中显示一些计算机专业的编程代码，当代码为一行代码时，你就可以使用<code>标签了，如下面例子： <code>var i=i+300;</code> 注意：在文章中一般如果要插入多行代码时不能使用<code>标签了。语法： <code>代码语言</code> 注：如果是多行代码，可以使用<pre>标签。

查看全部

0 采集收起
2018-03-22
逆水寒al

<address>标签，为网页加入地址信息一般网页中会有一些地址信息需要在网页中展示出来，这些地址信息如公司的地址就可以<address>标签。语法： <address>地址信息</address> 如： <address>北京市西城区德外大街10号</address> 在浏览器上显示的样式为斜体，如果不喜欢斜体，当然可以，可以在后面的课程中使用css样式来修改它<address>标签的默认样式。

查看全部

0 采集收起
2018-03-22
wangyou2626

在讲解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
逆水寒al

认识<hr>标签，添加水平横线在信息展示时，有时会需要加一些用于分隔的横线，这样会使文章看起来整齐些。如下图所示：语法： html4.01版本 <hr> xhtml1.0版本 <hr /> 注意： 1. <hr />标签和<br />标签一样也是一个空标签，所以只有一个开始标签，没有结束标签。 2. <hr />标签的在浏览器中的默认样式线条比较粗，颜色为灰色，可能有些人觉得这种样式不美观，没有关系，这些外在样式在我们以后学习了css样式表之后，都可以对其修改。 3. 大家注意，现在一般使用 xhtml1.0 的版本（其它标签也是），这种版本比较规范。

查看全部

0 采集收起来源：再来一个水平分割线 - 使用<hr>标签实现水平线标签
2018-03-22
逆水寒al

为你的网页中添加一些空格在上一节的例子，我们已经讲解过在html代码中输入空格、回车都是没有作用的。要想输入空格，必须写入 。语法：   在html代码中输入空格是不起作用的，如下代码。在浏览中显示，还是没有空格效果。输入空格的正确方法：在浏览器中的显示出来的空格效果。如下图所示。

查看全部

0 采集收起来源：再加点空格呢 - 使用特殊字符 实现空格标签
2018-03-22
逆水寒al

使用<br>标签分行显示文本对于上一小节的例子，我们想让那首诗显示得更美观些，如显示下面效果：怎么可以让每一句诗词后面加入一个折行呢？那就可以用到<br />标签了，在需要加回车换行的地方加入<br />，<br />标签作用相当于word文档中的回车。上节的代码改为：语法： xhtml1.0写法： <br /> html4.01写法： <br> 大家注意，现在一般使用 xhtml1.0 的版本的写法（其它标签也是），这种版本比较规范。与以前我们学过的标签不一样，<br />标签是一个空标签，没有HTML内容的标签就是空标签，空标签只需要写一个开始标签，这样的标签有<br />、<hr />和<img />。讲到这里，你是不是有个疑问，想折行还不好说嘛，就像在 word 文件档或记事本中，在想要折行的前面输入回车不就行了吗？很遗憾，在 html 中是忽略回车和空格的，你输入的再多回车和空格也是显示不出来的。如下边的代码。上面的代码在浏览中显示是没有回车效果的。如下图所示：总结：在 html 代码中输入回车、空格都是没有作用的。在html文本中想输入回车换行，就必须输入<br />。

查看全部

0 采集收起来源：写代码都不换行么? - 使用<br>标签实现换行效果
2018-03-22
wangyou2626

设置文字间隔或者字母间隔就可以使用letter-spacing来实现. 在英文单词时，是设置字母与字母之间的间距。 h1{ letter-spacing:50px; } 单词间距设置

查看全部

0 采集收起
2015-01-30
洛雪

border:2px solid red; 上面是border代码的缩写形式，可以分开写 border-width:2px; border-style:solid; border-color:red; 注意： 1、border-style（边框样式）常见样式有： dashed（虚线）| dotted（点线）| solid（实线） 3、border-width（边框宽度）中的宽度也可以设置为： thin | medium | thick（但不是很常用），最常还是用象素（px）。

查看全部

0 采集收起来源：画个圈圈 - 使用border为盒子添加边框（一）
2015-01-30
洛雪

盒模型： margin外边距、 padding内填充、 border边框，三者都用上右下左四个方向，可根据需要自行设置实际 height = 上下内填充 + 上下边框线实际 width = 左右内填充 + 左右边框线

查看全部

0 采集收起来源：变个盒子-什么是盒模型（视频）
2015-02-05
红小薯

在新建浏览器窗口中打开链接 <a href="目标网址" target="_blank">click here!</a>

查看全部

0 采集收起
2018-03-22
红小薯

caption标签，为表格添加标题和摘要摘要<table summary="表格简介文本"> 摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化)，使搜索引擎更好的读懂表格内容，还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。标题用以描述表格内容，标题的显示位置：表格上方。

查看全部

0 采集收起
2018-03-22
白色蓦然

语法： <a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a> 例如： <a href="http://www.imooc.com" title="点击进入慕课网">click here!</a> 上面例子作用是单击click here!文字，网页链接到http://www.imooc.com这个网页

查看全部

0 采集收起
2018-03-22

首页上一页 26722 26723 26724 26725 26726 26727 26728 下一页尾页

0/150

提交

取消

开始学习

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

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