慕课网

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

初识HTML(5)+CSS(3)

最热最新

云栖子

CSS样式的优势为什么使用css样式来设置网页的外观样式呢？右边编辑器是一段文字，我们想把“超酷的互联网”、“服务及时贴心”、“有趣易学”这三个短语的文本颜色设置为红色，这时就可以通过设置样式来设置，而且只需要编写一条css样式语句。第一步：把这三个短语用<span></span>括起来。（见右边代码编辑器13行）第二步：写入下列代码：（见右边代码编辑器7-8行） span{ color:red; } 观察结果窗口文字的颜色是否变为红色了。

查看全部

0 采集收起来源：为什么是css呢? - CSS样式的优势
2018-03-22
云栖子

认识CSS样式 CSS全称为“层叠样式表 (Cascading Style Sheets)”，它主要是用于定义HTML内容在浏览器内的显示样式，如文字大小、颜色、字体加粗等。如下列代码： p{ font-size:12px; color:red; font-weight:bold; } 使用CSS样式的一个好处是通过定义某个样式，可以让不同网页位置的文字有着统一的字体、字号或者颜色等。

查看全部

0 采集收起来源：给html打扮一下 - 认识CSS样式
2014-11-09
云栖子

form表单中的label标签小伙伴们，你们在前面学习表单各种控件的时候，有没有发现一个标签--label，这一小节就来揭晓它的作用。 label标签不会向用户呈现任何特殊效果，它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本，就会触发此控件。就是说，当用户单击选中该label标签时，浏览器就会自动将焦点转到和标签相关的表单控件上（就自动选中和该label标签相关连的表单控件上）。语法： <label for="控件id名称"> 注意：标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。例子： <form> <label for="male">男</label> <input type="radio" name="sex" id="male" /> <br /> <label for="female">女</label> <input type="radio" name="sex" id="female" /> <label for="email">输入你的邮箱地址</label> <input type="email" id="email" placeholder="Enter email"> </form>

查看全部

0 采集收起来源：使用label为input标签穿上衣服
2018-03-22
云栖子

使用重置按钮，重置表单信息当用户需要重置表单信息到初始时的状态时，比如用户输入“用户名”后，发现书写有误，可以使用重置按钮使输入框恢复到初始状态。只需要把type设置为"reset"就可以。语法： <input type="reset" value="重置"> type：只有当type值设置为reset时，按钮才有重置作用 value：按钮上显示的文字

查看全部

0 采集收起来源：使用重置按钮，重置表单信息
2018-03-22
云栖子

使用提交按钮，提交数据在表单中有两种按钮可以使用，分别为：提交按钮、重置。这一小节讲解提交按钮：当用户需要提交表单信息到服务器时，需要用到提交按钮。语法： <input type="submit" value="提交"> type：只有当type值设置为submit时，按钮才有提交作用 value：按钮上显示的文字

查看全部

0 采集收起来源：填完就可以提交咯 - 提交按钮
2018-03-22
云栖子

使用下拉列表框进行多选下拉列表也可以进行多选操作，在<select>标签中设置multiple="multiple"属性，就可以实现多选功能，进行多选时按下Ctrl键同时进行单击，可以选择多个选项。

查看全部

0 采集收起
2018-03-22
威cT

http://img1.sycdn.imooc.com//52da52200001e00e07930061.jpg 使用mailto在网页中链接Email地址，如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。http://img1.sycdn.imooc.com//52da52200001e00e07930061.jpg

查看全部

0 采集收起
2018-03-22
Wardog

<link href="style.css" rel="stylesheet" type="text/css" />

查看全部

0 采集收起
2018-03-22
小袜子

盒模型--边框（一）盒子模型的边框就是围绕着内容及补白的线，这条线你可以设置它的粗细、样式和颜色(边框三个属性)。如下面代码为div来设置边框粗细为2px、样式为实心的、颜色为红色的边框： div{ border:2px solid red; } 上面是border代码的缩写形式，可以分开写： div{ border-width:2px; border-style:solid; border-color:red; } 注意： 1、border-style（边框样式）常见样式有： dashed（虚线）| dotted（点线）| solid（实线）。 2、border-color（边框颜色）中的颜色可设置为十六进制颜色，如: border-color:#888;//前面的井号不要忘掉。 3、border-width（边框宽度）中的宽度也可以设置为： thin | medium | thick（但不是很常用），最常还是用象素（px）。盒模型--边框（二）现在有一个问题，如果有想为p标签单独设置下边框，而其它三边都不设置边框样式怎么办呢？css样式中允许只为一个方向的边框设置样式： div{border-bottom:1px solid red;} 同样可以使用下面代码实现其它三边上、右、左边框的设置： border-top:1px solid red; border-right:1px solid red; border-left:1px solid red; 盒模型--宽度和高度盒模型宽度和高度和我们平常所说的物体的宽度和高度理解是不一样的，css内定义的宽（width）和高（height），指的是填充以里的内容范围。因此一个元素实际宽度（盒子的宽度）=左边界+左边框+左填充+内容宽度+右填充+右边框+右边界。元素的高度也是同理。比如： css代码： div{ width:200px; padding:20px; border:1px solid red; margin:10px; } html代码： <body> <div>文本内容</div> </body>

查看全部

0 采集收起来源：画个圈圈 - 使用border为盒子添加边框（一）
2018-03-22
威cT

在新建浏览器窗口中打开链接 <a>标签在默认情况下，链接的网页是在当前浏览器窗口中打开，有时我们需要在新的浏览器窗口中打开。如下代码： <a href="目标网址" target="_blank">click here!</a>

查看全部

0 采集收起
2018-03-22
威cT

使用<a>标签，链接到别一个页面,<a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a> 只要为文本加入a标签后，文字的颜色就会自动变为蓝色（被点击过的文本颜色为紫色

查看全部

0 采集收起
2018-03-22
Wardog

selected="selected"：设置selected="selected"属性，则该选项就被默认选中

查看全部

0 采集收起来源：使用select、option标签创建下拉菜单
2018-03-22
小袜子

常用的块状元素有： <div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form> 常用的内联元素有： <a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code> 常用的内联块状元素有： <img>、<input> (1)将行内元素a转换为块状元素，从页使用a元素具有块状元素特点: a{display:block;} (2)块状元素也可以通过代码 display:inline 将元素设置为行内元素 (3)代码 display:inline-block 就是将元素设置为内联块状元素

查看全部

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

同一组的单选按钮，name取值一定要一致，比如上面例子为同一个名称“radioLove”，这样同一组的单选按钮才可以起到单选的作用。

查看全部

0 采集收起来源：填填性别和兴趣爱好 - 单选框、复选框，让用户选择
2014-11-09
威cT

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

查看全部

1 采集收起
2018-03-22

首页上一页 27728 27729 27730 27731 27732 27733 27734 下一页尾页

0/150

提交

取消

开始学习

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

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