当前位置： 首页>大数据>正文

牛客HTML入门题

大数据2024-10-22 17:19:12

表单类型

问题描述：请依次写出以下类型的输入框

  1. 类型为密码，默认值为"nowcoder"

  2. 类型为复选框，且状态为已勾选

<form>

<input type = "password" value = "nowcoder">

<input type = "checkbox" checked = "checked">

</form>

//<form>元素 用于定义HTML表单
// <fieldset>元素 组合表单中的相关数据，<legend>元素为<fieldset>元素定义标题。

<form>元素中的属性有：

action（规定向何处提交表单的地址）；
method（规定提交表单时的HTTP方法）；
target（规定action属性中地址的目标，默认：_self）；
accept-charset（规定在被提交的表单中使用的字符集，默认页面字符集）；
ectype（规定被提交数据的编码）；
autocomplete（规定浏览器应该自动完成表单，默认开启）等。

表单处理程序在表单的action属性中指定，通常表单会被提交到web服务器上的网页，若省略action属性，默认设置为当前页面。其中，<method>属性规定在提交表单时所用的HTTP方法（GET或POST）。

GET：适合少量数据的提交，浏览器会设定容量限制。
POST：安全性更好，因为在页面地址栏中被提交的数据是不可见的。

<input>元素中的属性

有type,name,value,readonly,disabled,size,maxlength等。(最重要的表单元素 input)

//若要被正确提交，每个输入字段必须设置一个name属性。

// 类型有 text、password、submit（向表单处理程序提交表单）、rodio（单选）、checkbox（复选框）、number（可限制范围）、date、color、range、month、week、time、e-mail、search、tel、url等

// <select> 元素 定义下拉列表，<option>元素定义待选择的选项，通常把首个选项显示为被选项，可用 selected 属性定义预定义选项。

// <textarea>元素定义多行输入字段

//<button>元素定义可点击的按钮

// HTML5新增元素：<datalist>、<keygen>、<output>

表格结构
表格标题

<table>标签定义表格
<tr>标签定义表格中的行
<td>定义在每行被分为若干个的单元格（数据单元格 table data-可以包括文本、图片、列表、表格等）

横跨列的单元格 colspan
横跨行的单元格 rowspan

表格和边框属性

<table border="1">

表格的表头

<th>标签定义表头

表格中的空单元格用空格占位符：&nbsp

表格标题 用属性caption定义

图像标签属性
<img>定义图像
属性：src—图片地址、title—图片标题、alt—代替文本属性
链接属性

<a href="#" target="_blank" name=""> </a>

音频、视频媒体标签属性

<audio src="#" controls="controls">
</audio>

<video src="#" controls="controls">
</video>

最好的HTML5解决办法：HTML5+<object>+<embed>


<video width="320" height="240" controls="controls">

  <source src="movie.mp4" type="video/mp4"/>

  <source src="movie.ogg" type="video/ogg"/>

  <source src="movie.webm" type="video/webm"/>

  <object data="movie.mp4" width="320" height="240">

  <embed src="movie.swf" width="320" height="240"/>

  </object>

</video>
列表

无序列表（粗体圆点标记）

  <ul>
    <li>
    </li>
  </ul>

有序列表（数字标记）

  <ol>
    <li>
    </li>
  </ol>

定义列表（定义列表以<dl>开始，自定义列表项以<dt>开始，自定义列表项的定义以<dd>开始）

  <dl>
    <dt> </dt>
    <dd> </dd>
  </dl>
语义化标签

优势:
1.代码结构清晰，有利于团队开发
2.方便其他设备解析，以语义的方式渲染网页
3.有利于搜索引擎优化（SEO）

其中 <head> 和 <header> 标签区别： <head> 用于定义文档头部，是所有头部元素的容器， <head> 中的元素可以引用脚本、指示浏览器在哪找样式表、提供元信息等。 <header> 用于定义文档的页眉（介绍信息）。


https://www.xamrdz.com/bigdata/7sj1996945.html

相关文章：