前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >HTML学习笔记1

HTML学习笔记1

作者头像
别团等shy哥发育
发布2023-02-27 10:05:07
1K0
发布2023-02-27 10:05:07
举报
文章被收录于专栏:全栈开发那些事

1.2 单标记和双标记 1.单标记:空标记,就是没有结束标记的称之为单标记。 语法:水平线标记:<hr /> 换行标记:<br /> 2.双标记:体标,就是这个标记有开始和结束 语法:<font></font> 1.3.文本控制和文本样式标记 1.段落标记<p></p>和换行标记<br /> 段落标记:段落与段落之间会自动换行 2.文本样式标记<font>内容</font> 常用的属性: face用来描述字体的样式 Size用来描述字体的大小,最大取值为7 Color用来描述字体的颜色,取值三种形式: *用英文单词来表示:red,green,blue *使用十六进制的数据表示:#ff0000 *使用RGB三原色表示:RGB(255,255,0) 3.其他标记 标题标记:<h1></h1>,<h2></h2>----------<h6></h6> 字体样式标记:字体加粗<b></b>字体倾斜<i></i>字体下划线<u></u> 4.图像标记: 1.图像标记:在网页上引入图片 语法:<img src=”图像的url”/> 常用的属性:src用来引入图片 width用来描述图片的宽度 height用来描述图片的高度 border用来描述图片的边框 注意:图片的路径分为绝对路径和相对路径(同级目录,上级目录,下级目录) 注释标记:<!—图像标记–>,注释标记的内容不回显示在网页上面 ****html描述网页的语言,并不是很严谨的语言,html标记通过被浏览器解析,展示特定的效果。 5.表格标记: 1.表格的作用:将数据更加有条理的显示出来;用来规划网页 2.语法:

代码语言:javascript
复制
   <table>
                  <tr>
                             <td>单元格的内容</td>
                  </tr>
         </table>
代码语言:javascript
复制
   tr:表示行(常用的属性 align 描述表格内的内容显示位置)
   td:表示单元格   
   th:表示单元格,文字自动居中,加粗
  常用的属性:
     border:给表格添加边框。
     width:描述表格的宽度。
     align:描述表格的位置
     cellspacing:描述表格的厚度
     cellpadding:描述文字与边框的距离
     合并操作:
  1. 要确定表格有多少行和多少列。 合并行:rowspan ,合并单元格:colspan 2.要确定合并的是行还是列。

6.表单标记 表单简介:吧用户输入的数据提交到服务器端,简单来说,表单用来让用户输入数据,表单把数据封装起来提交到指定的位置。 表单组成: >>>表单控件:用户输入数据,比如说输入用户名,输入密码。 >>>提示信息:告诉用户输入框要输入什么值, >>>表单域:标识表单的开始和结束,语法 提示信息:表单控件

  1. 创建表单
代码语言:javascript
复制
  比如:<form action="demo1.html" method="post" name="登陆表单">
   用户名:<input type="text" name="username" /><br/>
   密码:   <input type="password" name="psw" /><br/>
                <input type="submit" value="提交" />
</form>

常用的属性:action表示表单要提交的位置。 method:表单提交的方式,常用的有get和post提交,默认提交方式是 get提交 get提交:数据会显示在浏览器的地址栏,不安全,提交的数据大小是有限制的 post提交:数据不回显示在地址栏,是安全的,提交的数据大小没有限制 2. 表单控件:<input /> 输入框控件的属性type: 文本框:text 密码框:password 单选按钮:radio 复选按钮:checkbox 上传按钮:file 提交按钮:submit 重置按钮:reset 注意:表单想要把数据提交到指定的位置,输入框必须要有name属性。 3. 文本域标记:<textarea rows=”文本域的行数” cols=”文本域每行输入的字符数”></textarea> 比如: 评论:<br/>

代码语言:javascript
复制
<form method="get" action="demo1.html">
<!--注意:表单想要把数据提交到指定的位置,输入框必须要有name属性。-->
<textarea rows="5" clos="50" name="pinglun">输入评论,请注意文明用语</textarea><br/>
<input type="submit" value="提交评论" />
</form>

1.7列表标记和超链接标记 1.列表标记:有序列表标记、无需列表标记、自定义列表标记 无序列表:

代码语言:javascript
复制
<ul>
               <li>列表项内容1</li>
               <li>列表项内容2</li>
               <li>列表项内容3</li>
           </ul>
代码语言:javascript
复制
     属性:type 默认值disc,  square,circle

2.超链接标记:可以实现跳转的效果 语法:<a href=”跳转的url” target=”目标窗口的弹出方式”>文本或者图片</a> Target:_self 在原有的窗口打开网页 _blank 打开一个新的窗口显示要跳转的网页 比如:

代码语言:javascript
复制
     <a href="demo1.html" target="_self">自己站内跳转到demo1之self的效果</a><br/>
<a href="demo1.html" target="_blank">自己站内跳转到demo1之blank的效果</a><br/>

href属性:跳转的url 1.站内跳转 2.站外跳转 1.8

标记 Div:通常是用来实现网页布局

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020-03-15,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档