html入门 小灰灰 2022-08-19 11:17 201阅读 0赞 -------------------- ## HTML基础 ## ## 1、HTML概述 ## 概念: HTML:HyperText Markup Language 超文本标记语言 文本 ? 超文本 ? IE 360 FireFox Chrome W3C: HTML规范----HTML 4.0 XHTML规范----XHTML 1.0 HTML 5 HTML课程的重要性: ## B/S JSP ASP PHP ASP.NET ## ## 2、HTML的结构 ## 1)有两种后缀名 a).htm (在早期的Dos系统中,文件的命名规范采用8.3命名规则) b) .html(建议使用) 2)文档 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 文档类型:说明版本号 以及 dtd文件所在的位置 <html> <head> <title>标题</title> </head> <body> 我是世界上最出名的程序!~ HELLO WORLD!~ </body> </html> 3) HTML的特点 html标记要小写 html的标签要成对出现 结尾的都带 “/” ## html的语法比较松散,浏览器的容错能力强 ## ## 3、HTML的常用标记 ## 1)标题字 <h1>标题1</h1> <h2>标题2</h2> …… <h6>标题6</h6> 2)水平分隔线 <hr color="" /> 自封闭标记 3)段落标记 <p>段落</p> 4)换行标记 <br /> 5)字体标记 <font></font> 6)引入图片 <img src="" /> 7)滚动文字 <marquee ></marquee> 8)无序列表 <ul> <li>数学</li> <li>语文</li> </ul> 9)有序列表 <ol> <li>JQuery</li> <li>UI高级</li> ## ## ## 4、HTML的属性 ## 1)结构 <标记名称 属性名="属性值"></标记名称> 2)属性名要加""或者'' 3)属性要写在开始标签中 4)多个属性要使用空格来进行分隔,并且没有顺序 ## 5)属性名要小写 ## ## 5、HTML中的实体字符 ## 空格 > 大于号(>) < 小于号(<) & & ## " “ ## ## 6、颜色的表示方法 ## a)颜色名 red 表示红色 gray 表示灰色 b) 颜色值表示 #FF0000 表示红色 #00FF00 表示绿色 #0000FF 表示蓝色 c)rgb表示方式 ## rgb(数值,数值,数值) ## ## 7、路径 ## a)相对路径:从当前位置开始 . 当前的文件夹 .. 上一级文件夹 b)绝对路径:从根开始 file:///F|/课程/HTML基础课程/20110906/课堂练习/images/Summer.jpg ## 注意:路径不能有中文 ## -------------------- ## 1、HTML的注释 ## ## ## ## 2、HTML常用标记续 ## 1)粗体、斜体、下划线 <b>粗体</b> <i>斜体</i> <u>下划线</u> 2)超链接 a)内链接 定义一个位置<a name="#top"></a> 定位到#top的位置<a href="#top">回顶部</a> b)外链接 <a href="http://www.baidu.com" target="_blank">百度</a> 默认在当前页面打开 ## target=”\_blank” 打开新的页面中 ## ## 3、表格 ## 结构 <table><!-- 定义表 --> <tr><!-- 定义行 --> <th></th><!-- 定义表头 --> <td></td><!-- 定义列 --> </tr> ## ## ## 4、Form表单 ## <form action="Test01.html" method=""> 表单中的所有控件都要写在该位置 </form> action : 当我们点击提交按钮时,浏览器的地址栏中要跳转的位置 method :提交表单方式 get(默认) : 在提交表单的时候,把输入的参数显示到地址栏当中 post :在提交表单的时候,不会把输入的参数显示到地址栏当中 1)文本输入框 用户名:<input type="text" name="userName" id="userName"/> 2)密码输入框 密 码:<input type="password" name="userPwd" id="userPwd" /> 3)提交按钮 <input type="submit" value="提交" /> 4)重置按钮 <input type="reset" /> 注意:重置并不代表一定要清空 5)单选按钮 <input type="radio" name="gender" value="m" checked="checked"/>男 <input type="radio" name="gender" value="f"/>女 6)复选框 <input type="checkbox" name="hobby" value="1"/>体育 7)下拉列表 <select> <option>选项</option> </select> 8)文本域 <textarea cols="40" rows="5" name="description" ></textarea> 9)普通按钮 <input type="button" value="普通按钮" /> -------------------- ## 1、HTML的注释 ## ## ## ## 2、HTML常用标记续 ## 1)粗体、斜体、下划线 <b>粗体</b> <i>斜体</i> <u>下划线</u> 2)超链接 a)内链接 定义一个位置<a name="#top"></a> 定位到#top的位置<a href="#top">回顶部</a> b)外链接 <a href="http://www.baidu.com" target="_blank">百度</a> 默认在当前页面打开 ## target=”\_blank” 打开新的页面中 ## ## 3、表格 ## 结构 <table><!-- 定义表 --> <tr><!-- 定义行 --> <th></th><!-- 定义表头 --> <td></td><!-- 定义列 --> </tr> ## ## ## 4、Form表单 ## <form action="Test01.html" method=""> 表单中的所有控件都要写在该位置 </form> action : 当我们点击提交按钮时,浏览器的地址栏中要跳转的位置 method :提交表单方式 get(默认) : 在提交表单的时候,把输入的参数显示到地址栏当中 post :在提交表单的时候,不会把输入的参数显示到地址栏当中 1)文本输入框 用户名:<input type="text" name="userName" id="userName"/> 2)密码输入框 密 码:<input type="password" name="userPwd" id="userPwd" /> 3)提交按钮 <input type="submit" value="提交" /> 4)重置按钮 <input type="reset" /> 注意:重置并不代表一定要清空 5)单选按钮 <input type="radio" name="gender" value="m" checked="checked"/>男 <input type="radio" name="gender" value="f"/>女 6)复选框 <input type="checkbox" name="hobby" value="1"/>体育 7)下拉列表 <select> <option>选项</option> </select> 8)文本域 <textarea cols="40" rows="5" name="description" ></textarea> 9)普通按钮 <input type="button" value="普通按钮" /> -------------------- ## 1、HTML框架标签的使用(frameset) ## 1)frameset cols:是按照列进行分割 rows:是按照行进行分割 可以进行嵌套使用 frame 参考文档 注意: frameset标签是不可以与body进行同时使用 ## 左、右 ## ## 2、表格布局 ## 参考: ## TableTest01.html ## ## 3、内联框架 ## <iframe> 不能自封闭 ## 使用方法参考API 、IfrmaeTest01.html ## ## 4、fieldset标签的使用 ## <fieldset> <legend>登陆</legend> 用户名:<input type="text" name="userName" id="userName"/><br /><br /> 密 码:<input type="password" name="userPwd" id="userPwd" /> </fieldset>
相关 HTML入门 目录 1.什么是HTML 2.固定格式 3.第一个HTML 3.各部分细节详解 3.1 标题 3.2 段落 3.3 链接 3.4 图像 3.5 表格 3. àì夳堔傛蜴生んèń/ 2023年10月11日 19:36/ 0 赞/ 47 阅读
相关 html入门 HTML基本格式 1 <html> 2 <head></head> 3 <body> 4 this is my 布满荆棘的人生/ 2023年06月03日 09:58/ 0 赞/ 16 阅读
相关 (html入门)HTML 样式 HTML 样式 style 属性用于改变 HTML 元素的样式。 eg: <html> <body style="background-color: àì夳堔傛蜴生んèń/ 2022年09月02日 12:46/ 0 赞/ 226 阅读
相关 html入门 -------------------- HTML基础 1、HTML概述 概念: HTML:HyperText Markup Language 超 小灰灰/ 2022年08月19日 11:17/ 0 赞/ 202 阅读
相关 HTML入门 强烈推荐一个大神的人工智能的教程:[http://www.captainbed.net/zhanghan][http_www.captainbed.net_zhanghan] 深藏阁楼爱情的钟/ 2022年07月29日 11:42/ 0 赞/ 180 阅读
相关 HTML 入门 1、什么是HTML HTML(Hyper Text Markup Language),超级文本标记语言 超文本: a 标记 ゝ一世哀愁。/ 2022年07月15日 00:14/ 0 赞/ 179 阅读
相关 HTML 入门 1、什么是HTML HTML(Hyper Text Markup Language),超级文本标记语言 超文本: a 标记 淩亂°似流年/ 2022年07月15日 00:14/ 0 赞/ 175 阅读
相关 HTML入门 HTML入门 1. web概念概述 2. HTML web概念概述 JavaWeb: 使用Java语言开发基于互联网的项目 今天药忘吃喽~/ 2022年05月13日 08:50/ 0 赞/ 226 阅读
相关 HTML入门 HTML入门 1.什么是HTML?(Hyper Text Markup Language:超文本标记语言) 2.语法和规范? 3.HTML相关标签学习 傷城~/ 2022年04月06日 05:38/ 0 赞/ 239 阅读
相关 HTML入门 what is HTML HTML: Hyper Text Markup Language 超文本标签语言 对网页中的文本,图片,声音进行描述 HTML格式 ﹏ヽ暗。殇╰゛Y/ 2021年11月16日 16:56/ 0 赞/ 310 阅读
还没有评论,来说两句吧...