前端网页三剑客------HTML基础

一、HTML基础语法

基本语法包含：标签和属性
1. 文件的后缀  .html   .htm
2. 标签由尖括号包围的关键词  <html>  <head> <body>  <title>
3. 标签分类：① 双边标签： <html></html>     ② 单边标签：  <hr />
4. 标签的嵌套：要正确嵌套正确演示： <head><title>我是标题</title><</head>错误演示：<head><title></head></title>
5. 标签不区分大小写（建议小写）,小写会专业一些。
6. 在开始标签中可以定义属性，属性是以键值对的形式，值需要引号 引起来<h1 align="center"></h1>
7. 标签名都是预定义好的，可以直接使用但不可以随便定义 ，比如<h88> 这个就不属于预先定义好的标签，没有作用
8. 属性：开始标签中定义的键值对成为属性

二、HTML常见标签

一、文本标签

1、标题标签：<h1></h1> ~~ <h6></h6>      数字越大，文字越小
2、段落标签：<p></p>                   分段，段落之间有行距
3、文本格式化标签：换行：br                       没有行距分割线：hr                       在HTML页面中创建一条水平的分割线【属性：width，size，color】加粗：b  或者 strong斜体：i上标：sup                      表示次方等下标：sub                      表示索引等字体格式化：<font></font>       设置字体尺寸、字体颜色等；【属性：color，size（1--7，默认是3）】居中：<center></center>      将文本居中显示

二、多媒体标签

1、图片标签：<img src=”” width=”” height=”” alt=”” title=”” />width：宽度height：高度title：悬浮文字，当鼠标悬浮到图片上时的提示文字alt：替代文本，图片未正常加载时替代src：图片路径相对路径：./ 当前目录  ../ 上一级目录 ../../ 上上一级目录绝对路径：网络：https://www.baidu.com本地:D:\images\火星辉.jpg2、音频标签：<audio src="" muted controls loop></audio>
3、视频标签：<video src="" width="" height="" muted controls loop ></video>src：文件路径controls：控件，比如播放按钮loop：循环播放muted：静音

三、列表标签

1、有序列表：【type：设置序号样式，默认是数字】<ol><li>列表项</li><li>列表项</li></ol>2、无序列表：【type：设置无序样式，disc：圆，square：方块，circle：空心圆】<ul><li>列表项</li><li>列表项</li></ul>

四、超链接标签

<a href="" target="">提供页面跳转的一种方式</a>href：目标路径target：打开方式【_blank  在新的选项卡中打开，    _self  在本页面打开（默认）】

五、表格标签

 表格:table          表格caption     表头tr          行td      数据列th      标题列（文字加粗、水平居中）thead       表头tbody         表体tfoot         页脚属性:border       边框 默认是0width        宽度bgcolor      背景颜色align        对齐方式，left、center、rightcellspacing  单元格之间的缝隙cellpadding  单元格和文字之间的缝隙colspan：   合并列，值为几，合并几列rowspan：   合并行

六、表单标签

表单的主要作用是接收用户的输入，当用户提交表单时，浏览器将用户在表单中输入的数据打包，并发送给服务器，从而实现用户与Web服务器的交互。<form action="http://localhost:8080/jd/login">用户名<input type="username" name="username"/>密码 <input type="password" name="password"/><input type="submit" value="登录"/></form>表单属性：action：表单提交的路径method：提交方式【get、post】input属性：id：唯一标识type：类型name：名称value：值checked：设置单选框/复选框的默认选中状态（全选、反选）readonly：设置该标签的参数值只读，用户无法手动更改。但是数据是可以正常提交disabled：设置该标签不可用（禁用），参数值无法更改，且参数值也无法提交size：组件的长度maxlength：设置允许输入的最大的长度placeholder：输入框的提示信息input-type说明：text：文本框(默认)，单行的输入字段，用户可在其中输入纯文本。password：密码框。  内容为非明文radio：单选框。  必须将其设置为同一组(name的名字必须相同)checkbox：复选框。  必须将其设置为同一组(name的名字必须相同)file：附件框。用于文件上传。hidden：隐藏域。数据可以通过表单发送至服务器，但是浏览器不会显示。submit：提交按钮reset：重置按钮image：图形提交按钮button：普通按钮select下拉列表：name：名称option：列表项multipe：支持多选textarea文本域：cols：列数rows：行数

三、标签分类

1、块标签：以区域块方式出现。每个块标签独自占一整行或者多行，且可设置宽高。如：<div> 、<h> 、<ul>、<p>、<li>等2、行标签：按行排列。无法设置宽高如：<span> 、 <strong> 、<a>等3、行块标签：按行排列，但又可以设置宽高的标签。如：<img>、<input>、<textarea>等可以通过display属性切换类型，取值如下：inline：行元素block：块元素inline-block:行块元素（内联元素）none：隐藏元素

前端网页三剑客------HTML基础相关推荐

前端网页三剑客------JavaScript基础
前端网页三剑客------JavaScript基础一.基础语法 1.引入方式行内JS:在标签内部编写JS代码,配合事件使用.<input type="button" val ...
前端网页三剑客------CSS基础
前端网页三剑客------CSS基础一.三种引入CSS的方式 1.行内样式:在指定标签元素内部添加style属性,配置css效果,多个效果之间有分号隔开.缺点: 代码可重用性比较低,可维护性比较低 ...
前端三剑客-前端开发的三大基础语言
如今前端的技术更新速度越来越快,与其说更新速度不如说前端领域的边界不断被拓宽.从最初的PC端浏览器,然后是移动端,再然后是各种终端.WEB前端已经从最初的信息展示,发展成为与用户关系日益密切的应用形式 ...
Web前端开发三剑客是做什么的？
大家都熟知,Web前端开发三剑客就是HTML.CSS.JavaScript.通过三种技术的融合产生了各式各样的网站.那Web前端开发三剑客分别是做什么的呢?主要在网站开发中主要完成哪些动作? Web前 ...
app前后台交互php_PHP丨前端网页是怎么跟后台进行数据交互的（实战）
本期需要用到的前面几期所讲过的内容: 这里是 PHP 网站开发的第三个阶段,也就是前端 HTML 及 CSS 所制作的网页是如何跟 PHP 后台代码进行交互的. 向后台提交数据前端网页代码: 留言本 ...
javascript技术教程蔡敏_程序员都必掌握的前端教程之JavaScript基础教程（上）
阅读本文约需要10分钟,您可以先关注我们,避免下次无法找到. 本篇文章成哥继续带大家来学习前端教程之JavaScript,网页的动态事件基本上都是靠它来实现的.下面我们就一起来学习内容吧! 01 Ja ...
学习前端需要掌握什么基础？
学习前端需要掌握什么基础?前端基础包含HTML.CSS层叠样式表.JavaScript.HTML5.CSS3.jQuery等内容.掌握了HTML+CSS+Javascript这三门技术就算入门前端了, ...
php网站用框架与不用的区别,做前端网页是不是必须要用网页框架
做前端网页是不是必须要用网页框架 2017-09-15 做前端网页是不是必须要用网页框架?个人感觉这分为两种情况,一种是能力超强,时间够用的情况,另外一种就是用前端网页框架,可以节约开发时间和减少工作 ...
采用EasyNVR网页无插件互联网直播平台对接海康摄像头如何通过SDK将视频在前端网页上进行播放？
背景分析安防摄像头在进行互联网直播中所使用的EasyNVR核心在于摄像机的音视频流的获取.转换.转码与高性能分发,同时同步完成对实时直播流的录像存储,在客户端(PC浏览器.Android.iOS.微 ...

前端网页三剑客------HTML基础

前端网页三剑客------HTML基础

一、HTML基础语法

二、HTML常见标签

三、标签分类

前端网页三剑客------HTML基础相关推荐

最新文章

热门文章