图文专栏

织梦二开 实用技巧 HTML5/CSS3速成教程 学习笔记 数码百科 Iphone教程 电脑技巧 手机测评 金碟软件 电脑测评 平板测评 纸飞机聊天app下载

  • 6-4 input标签中的数字框number类型

    6-4 input标签中的数字框number类型

    我们来学习input标签中的数字框number类型，先来看一下数字框长什么样子吧。 技术点的解释： 1、input的type属性设置为number,则表示该输入框的类型为数字。 2、数字框只能输入数字，输入其他字符无效。 3、数字框最右侧会有一个加减符号,可以调整输入数字的大小,不同浏览器表现不一致。 是不是很简单呢?

    大小：261M更新时间：2021-03-05 15:02:40立即观看

  • 6-3 placeholder属性的使用

    6-3 placeholder属性的使用

    这一项章节我们来学习input标签中占位符placeholder,属性，有时候需要提示用户输入框需要输入框的内容，那么就会用到我们的占位符，比如下面的效果： 想要实现这样的效果,我们只需要输入以下代码： 技术点的解释： 1、placeholder属性为输入框占位符,里面可以放提示的输入信息。 2、placeholder属性的值可以任意填写,当输入框输入内容时,占位符内容消失,输入框无内容时,占位符...

    大小：261M更新时间：2021-03-05 14:36:58立即观看

  • 6-2 文本输入框、密码输入框

    6-2 文本输入框、密码输入框

    当用户要在表单中键入字母、数字等内容时，就会用到文本输入框。文本框也可以转化为密码输入框。 语法： form input type="text/password" name="名称" value="文本" //form 1、type： 当type=text时，输入框为文本输入框; 当type=password时, 输入框为密码输入框。 2、name：为文本框命名，以备后台程序ASP 、PHP使用。...

    大小：261M更新时间：2021-03-05 14:31:20立即观看

  • 6-1 使用表格标签<form>创建表单

    6-1 使用表格标签<form>创建表单

    网站怎样与用户进行交互？答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送到服务器端，这样服务器端程序就可以处理表单传过来的数据。 语法： form method="传送方式" action="服务器文件" 讲解： 1.form ：form标签是成对出现的，以form开始，以/form结束。 2.action ：浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php...

    大小：261M更新时间：2021-03-05 14:09:19立即观看

  • 5-5 使用thead、tbody、tfoot定义表格

    5-5 使用thead、tbody、tfoot定义表格

    在上一章节中,我们已经学习了用table标签家族来定义一个表格,我们使用到了tr标签来定义表格的行,th和td来定义表格的列,那么这一章,我们来学习thead标签定义表格头部,tbody标签来定义表格的内容,tfoot来定义表格的底部,来将我们的表格继续完善吧！ 创建表格的三个区域： thead、tbody、tfoot 我们想实现一个成绩表,各科成绩和总分,效果如下图： 我们表格第一行为表头数据,...

    大小：261M更新时间：2021-03-05 14:02:11立即观看

  • 5-4 使用table家庭为网页添加表格

    5-4 使用table家庭为网页添加表格

    有时候我们需要在网页当中添加一些数据,如某公司想展示该公司员工的通信录，如下表： 那我们就需要用到表格标签了, 这一章我们来学习表格标签，那么这些标签有什么特点呢？让我们一起来探索吧。想要在网页中实现以上效果,我们可以使用以下代码： 上面代码解释： 创建表格的四个元素：table、tr、th、td 1、table/table：整个表格以table标记开始、/table标记结束。 2、tr/tr：表...

    大小：261M更新时间：2021-03-04 17:37:14立即观看

  • 5-3 在新建浏览器窗口中打开链接

    5-3 在新建浏览器窗口中打开链接

    我们这一章节来学习a标签中的target属性，可以先看一个例子： 我们要实现这样的效果,可以输入以下代码： 技术点的解释： a标签有的target属性，代表打开网页的方式。可选值为_self和_blank，默认值为_self，代表在当前页面打开链接，_blank代表在新窗口打开链接。

    大小：261M更新时间：2021-03-04 17:27:47立即观看

  • 5-2 使用<a>标签为网页添加超链接

    5-2 使用<a>标签为网页添加超链接

    使用a标签可实现超链接，它在网页制作中可以说是无处不在，只要有链接的地方，就会有这个标签。 语法： a href="目标网址" title="鼠标滑过显示的文本"链接显示的文本/a 例如： a href="http://www.57zxw.net" title="点击进入57自学网"click here!/a 上面例子作用是单击click here!文字，网页链接到http://www.57zxw...

    大小：261M更新时间：2021-03-04 17:21:50立即观看

  • 5-1 使用<img>标签为网页添加图片

    5-1 使用<img>标签为网页添加图片

    在网页的制作中为使网页炫丽美观，肯定是缺少不了图片，可以使用 img 标签来插入图片。 语法： img src=图片地址 alt=下载失败时的替换文本 title = 提示文本 举例： img src = myimage.gif alt = My Image title = My Image / 讲解： 1 、src： 标识图像的位置； 2 、alt： 指定图像的描述性文本，当图像不可见时（下载不...

    大小：261M更新时间：2021-03-04 17:20:34立即观看

  • 4-1 使用<ul><li>标签实现无序列表

    4-1 使用<ul><li>标签实现无序列表

    在浏览网页时，你会发现网页上有很多信息的列表，如新闻列表、图片列表，如下图所示。 新闻列表 图片列表 这些列表就可以使用ul-li标签来完成。ul-li是 没有前后顺序 的信息列表。 语法： ul li信息/li li信息/li ...... /ul 举例： ul li 精彩少年 /li li 美丽突然出现 /li li 触动心灵的旋律 /li /ul ul-li在网页中显示的默认样式一般为：每项...

    大小：261M更新时间：2021-03-01 17:02:55立即观看

  • 4-2 使用<ol><li>标签实现有序列表

    4-2 使用<ol><li>标签实现有序列表

    如果想在网页中展示 有前后顺序 的信息列表，怎么办呢？如，当当网上的书籍热卖排行榜，如下图所示。这类信息展示就可以使用 ol 标签来制作 有序列表 来展示。 语法： ol li 信息 /li li 信息 /li ...... /ol 举例： 下面是一个热点课程下载排行榜： ol li前端开发面试心法 /li li 零基础学习html /li liJavaScript全攻略/li /ol ol 在网...

    大小：261M更新时间：2021-03-01 17:02:25立即观看

  • 3-3 使用<hr>标签实现水平线标签

    3-3 使用<hr>标签实现水平线标签

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

    大小：261M更新时间：2021-03-01 16:38:40立即观看

  • 3-2 使用特殊字符&nbsp;实现空格标签

    3-2 使用特殊字符&nbsp;实现空格标签

    在上一节的例子，我们已经讲解过在html代码中输入 空格 、 回车 都是没有作用的。要想输入空格，必须写入 nbsp; 。 语法： nbsp; 在html代码中输入空格是不起作用的，如下代码。 在浏览中显示，还是没有空格效果。 输入空格的正确方法： 在浏览器中的显示出来的空格效果。如下图所示。 源代码： !DOCTYPE htmlhtmlhead meta charset="UTF-8" titl...

    大小：261M更新时间：2021-03-01 16:33:29立即观看

  • 3-1 使用<br>标签实现换行效果

    3-1 使用<br>标签实现换行效果

    对于上一小节的例子，我们想让那首诗显示得更美观些，如显示下面效果： 怎么可以让每一句诗词后面加入一个折行呢？那就可以用到 br / 标签了，在需要加回车换行的地方加入br /，br /标签作用相当于word文档中的回车。 上节的代码改为： 语法： xhtml1.0写法： br / html4.01写法： br 大家注意，现在一般使用 xhtml1.0 的版本的写法（其它标签也是），这种版本比较规范...

    大小：261M更新时间：2021-03-01 14:58:01立即观看

  • 2-9 <aside>定义侧边栏区

    2-9 <aside>定义侧边栏区

    我们继续我们的快乐代码之旅。这一章节我们来学习aside标签，定义一个侧边栏区域。 例如网站中侧栏部分 那就让我们开始吧 源代码 !DOCTYPE htmlhtmlhead meta charset="UTF-8" titleaside/title/headbody aside我是侧边栏/ aside /body/html

    大小：261M更新时间：2021-02-26 16:54:03立即观看

  • 2-8 <section>定义区段

    2-8 <section>定义区段

    这一章节我们来学习section标签，定义一个区域。 那就让我们开始吧 源代码 !DOCTYPE htmlhtmlhead meta charset="UTF-8" titlesection/title/headbody header我是头部标签/header section我是一个区域/section footer我是底部标签/footer/body/html

    大小：261M更新时间：2021-02-26 16:53:40立即观看

  • 2-7 <footer>标签定义底部区域

    2-7 <footer>标签定义底部区域

    这一章节我们来学习footer标签，用来定义底部区域。 例如57自学网底部部分 那就让我们开始吧 源代码： !DOCTYPE htmlhtmlhead meta charset="UTF-8" titlefooter/title/headbody header我是头部标签/header footer我是底部标签/footer/body/html

    大小：261M更新时间：2021-02-26 16:39:15立即观看

  • 2-6 <header>标签定义头部区域

    2-6 <header>标签定义头部区域

    从这一章节开始,我们来学习html5新增的语义化标签,首先我们来学习header标签，用来定义头部区域。 例如57自学网顶部部分 那就让我们开始学习吧

    大小：261M更新时间：2021-02-26 16:32:43立即观看

  • 2-3 使用<span>标签自定义文字

    2-3 使用<span>标签自定义文字

    这一小节讲解span标签，这个标签是没有语义的，它的作用就是为了设置单独的样式用的。 如果现在我们想把下面的第一段话美国梦三个字设置成blue（蓝色），所以这样情况下就可以用到span标签了。 如下面例子： p1922年的春天，一个想要成名名叫尼克卡拉威（托比马奎尔Tobey Maguire 饰）的作家，离开了美国中西部，来到了纽约。那是一个道德感渐失，爵士乐流行，走私为王，股票飞涨的时代。为了追...

    大小：261M更新时间：2021-02-26 16:23:23立即观看

  • 2-5 使用<div>标签自定义块

    2-5 使用<div>标签自定义块

    在网页制作过程过中，可以把一些独立的逻辑部分划分出来，放在一个 div 标签中，这个div标签的作用就相当于一个容器。 语法： div/div 确定逻辑部分： 什么是逻辑部分？它是页面上相互关联的一组元素。如网页中的独立的 栏目版块 ，就是一个典型的逻辑部分。如下图所示：图中用红色边框标出的部分就是一个逻辑部分，就可以使用 div 标签作为容器。 源代码： div h2热门课程排行榜/h2 ol ...

    大小：261M更新时间：2021-02-26 16:20:59立即观看

  • 2-4 使用<hx>标签为网页增加标题

    2-4 使用<hx>标签为网页增加标题

    文章的段落用p标签，那么文章的标题用什么标签呢？在本节我们将使用hx标签来制作文章的标题。 标题标签一共有6个，h1、h2、h3、h4、h5、h6分别为一级标题、二级标题、三级标题、四级标题、五级标题、六级标题。并且依据重要性递减。h1是最高的等级。 语法： hx标题文本/hx (x为1-6) 文章的标题前面已经说过了，可以使用标题标签，另外网页上的各个栏目的标题也可使用它们。 如下图为腾讯网站：...

    大小：261M更新时间：2021-02-26 16:12:53立即观看

  • 2-2 <p>段落标签和使用

    2-2 <p>段落标签和使用

    如果想在网页上显示文章，这时就需要p标签了，把文章的段落放到p标签中。 语法： p段落文本/p 注意一段文字一个p标签，如在一篇新闻文章中有3段文字，就要把这3个段落分别放到3个p标签中。如下图所示： 在浏览器中显示的效果： p标签的默认样式，可以在上图中看出来，段前段后都会有空白，如果不喜欢这个空白，可以用css样式来删除或改变它，在后面课程中会学习到。 源代码： !DOCTYPE htmlht...

    大小：261M更新时间：2021-02-26 15:55:43立即观看

  • 2-1 语义化，让你的网页更好的被搜索引擎理解

    2-1 语义化，让你的网页更好的被搜索引擎理解

    在这一章节我们要开始把网页中常用到的标签一 一向大家介绍，学习这一章节的时候要记住学习html标签过程中，主要注意两个方面的学习：标签的用途、标签在浏览器中的默认样式。 标签的用途：我们学习网页制作时，常常会听到一个词，语义化。那么什么叫做语义化呢，说的通俗点就是：明白每个标签的用途（在什么情况下使用此标签合理）比如，网页上的文章的标题就可以用标题标签，网页上的各个栏目的栏目名称也可以使用标题标签...

    大小：261M更新时间：2021-02-26 15:44:12立即观看

  • 1-7 html文件注释

    1-7 html文件注释

    什么是代码注释？代码注释的作用是帮助程序员标注代码的用途，过一段时间后再看你所编写的代码，就能很快想起这段代码的用途。代码注释不仅方便程序员自己回忆起以前代码的用途，还可以帮助其他程序员很快的读懂你的程序的功能，方便多人合作开发网页代码。 语法： !--注释文字 -- 如：右边编辑器的代码的第 8、12 行都是，但是你会发现注释代码是不会在结果窗口中显示出来的。 源代码： !DOCTYPE HTM...

    大小：261M更新时间：2021-02-26 15:39:54立即观看

  • 1-6 认识body标签

    1-6 认识body标签

    在网页上要展示出来的页面内容一定要放在body标签中。如下图的例子： 在浏览器中的显示效果： 源代码： !DOCTYPE htmlhtmlhead meta charset="UTF-8" title了不起的盖茨比/title/headbody !-- 标题标签 -- h1了不起的盖茨比/h1 !-- 段落标签 -- p1922年的春天，一个想要成名名叫尼克卡拉威（托比马奎尔Tobey Magui...

    大小：261M更新时间：2021-02-26 15:34:22立即观看

  • 1-5 认识head标签

    1-5 认识head标签

    这一章节我们来学head标签。我们先来看一下head标签长什么样 文档的头部描述了文档的各种属性和信息，包括文档的标题等，绝大多数文档头部包含的数据都不会真正作为内容显示给读者。 下面这些标签可用在 head 部分： 1、head标签为双标签，有尾标签，head/head。 2、head标签表示头部标签,通常用来嵌套meta、title、style等标签。 3、title标签：在title和/ti...

    大小：261M更新时间：2021-02-26 15:26:26立即观看

  • 1-4 html5文档结构

    1-4 html5文档结构

    html文档结构为下图： 技术点的解释： 1.!DOCTYPE html:文档类型声明，表示该文件为 HTML5文件。!DOCTYPE 声明必须是 HTML 文档的第一行，位于 html 标签之前 2. html/html标签对：html标签位于HTML文档的最前面，用来标识HTML文档的开始；/html标签位于HTML文档的最后面，用来标识HTML 文档的结束；这两个标签对成对存在，中间的部分是...

    大小：261M更新时间：2021-02-26 15:24:16立即观看

  • 1-3 html/css使用说明书 - 标签的语法

    1-3 html/css使用说明书 - 标签的语法

    1. 标签 由英文尖括号 和 括起来，如 html 就是一个标签。 2. html中的标签一般都是成对出现的，分 开始标签 和 结束标签 。结束标签比开始标签多了一个 / 。 如： （1） p/p （2） div/div （3） span/span 3. 标签与标签之间是可以嵌套的，但先后顺序必须保持一致，如：div里嵌套p，那么/p必须放在/div的前面。如下图所示。 4. HTML标签不区分大...

    大小：261M更新时间：2021-01-16 14:52:47立即观看

  • 1-2 html和css的关系

    1-2 html和css的关系

    这一章节我们来学习html与css的关系。我们先来看一下单纯的html标签长什么样： 代码如下： p我是一个p标签/p 我们再来看一下经过css修饰过后html标签： 代码如下： p { color: red; border: 1px solid blue; width: 140px; height: 40px; } 技术点的解释： 1、css是用来修饰html样式的 2、html本身是有一些默认...

    大小：261M更新时间：2021-01-16 14:41:14立即观看

  • 1-1 代码初体验，制作我的第一个网页

    1-1 代码初体验，制作我的第一个网页

    欢迎来到HTML+CSS课堂，加入高端大气上档次的web前端开发团队。我们在正式学习之前，先来热热身，问候下世界，做个人生中的第一个html网页吧。 !DOCTYPE htmlhtmlhead meta charset="UTF-8" title制作我的第一个网页/title/headbody/body/html

    大小：261M更新时间：2021-01-16 14:39:44立即观看