`

HTML&CSS基础学习笔记1.23-表单的文本域和下拉列表

    博客分类:
  • HTML
阅读更多

文本域

<textarea>标签定义多行的文本输入控件。

平时在网页上的一些需要输入比较多的内容的输入框,比如回复帖子,回答问题等,都可以用<textarea>标签。

<textarea>文本区中可容纳无限数量的文本,可以通过 [cols] 和 [rows] 属性来规定 <textarea> 的尺寸。

例如:

<textarea cols=”100” rows=”6”></textarea>  

表示尺寸为100列6行的文本域。

实例:

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <link rel="stylesheet" type="text/css" href="index.css">  
    <title>表单</title>  
</head>  
<body>  
<h1>在表单中使用<textarea>标签</h1>  
    <form action="/" method="get">  
        <h2>个人简介</h2>  
        <textarea cols="10" rows="5" maxcols="20" maxrows="10">  
        </textarea>  
    </form>  
</body>  
</html>  



 

下拉列表

下拉列表在表单中也是比较常见,比如选择省份、城市的时候会用到下拉列表。

<select>标签可创建单选或多选的下拉列表菜单。
<option>标签表示下拉列表的列表项。<option>标签可以在不带有任何属性的情况下使用,但是你通常需要使用 [value] 属性,此属性会指示出被送往后台的内容。
<select>标签与<option>标签一起使用:

<select>  
    <option value="0">请选择</option>  
    <option value="1">选项A</option>  
    <option value="2">选项B</option>  
</select>  

实例:

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <link rel="stylesheet" type="text/css" href="index.css">  
    <title>表单</title>  
</head>  
<body>  
<h1>在表单中使用<select>标签</h1>  
<form action="/" method="get">  
    <h2>下拉列表</h2>  
    <p>你正在学习:  
        <select>  
            <option value="html">HTML</option>  
            <option value="css">CSS</option>  
            <!-- 在此处添加一个列表项 -->  
            <option value="sss">sss</option>  
        </select>  
    </p>  
</form>  
</body>  
</html>  

 更多学习内容,就在码芽网http://www.mayacoder.com/lesson/index



 

  • 大小: 13.4 KB
  • 大小: 14.7 KB
0
0
分享到:
评论
1 楼 octopole 2016-08-26  
2333333

相关推荐

    html&css;韩顺平笔记---HTML部分.ppt

    本课件为韩顺平老师的HTML CSS JS 课程中的笔记整理,注意是截图版的 如需要下载文字版的请绕道 估计网上也找不到文字版的 本教程适合电脑复习用的

    学习笔记HTML-css-JS.zip

    学习笔记HTML-css-JS.zip学习笔记HTML-css-JS.zip学习笔记HTML-css-JS.zip 学习笔记HTML-css-JS.zip学习笔记HTML-css-JS.zip学习笔记HTML-css-JS.zip 学习笔记HTML-css-JS.zip学习笔记HTML-css-JS.zip学习笔记...

    HTML CSS JS 学习、git-笔记.zip

    HTML CSS JS 学习、git-笔记HTML CSS JS 学习、git-笔记 HTML CSS JS 学习、git-笔记HTML CSS JS 学习、git-笔记 HTML CSS JS 学习、git-笔记HTML CSS JS 学习、git-笔记 HTML CSS JS 学习、git-笔记HTML CSS JS ...

    HeadFirst HTML&amp;CSS学习笔记.zip

    CSS学习笔记 HeadFirst HTML&amp;CSS学习笔记HeadFirst HTML&amp;CSS学习笔记 HeadFirst HTML&amp;CSS学习笔记HeadFirst HTML&amp;CSS学习笔记 HeadFirst HTML&amp;CSS学习笔记HeadFirst HTML&amp;CSS学习笔记 Head...

    BootStrap表单控件之文本域textarea

    表单控件——文本域textarea&lt;/title&gt; &lt;!-- 最新版本的 Bootstrap 核心 CSS 文件 --&gt; &lt;link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css

    JavaWeb新版教程-html&CSS-L和CSS-表单格式化.avi

    JavaWeb新版教程-html&CSS-L和CSS-表单格式化.avi

    JavaWeb新版教程-html&CSS-L和CSS-表单提交的细节.avi

    JavaWeb新版教程-html&CSS-L和CSS-表单提交的细节.avi

    学习html&amp;css的笔记.zip

    css的笔记学习html&amp;css的笔记学习html&amp;css的笔记 学习html&amp;css的笔记学习html&amp;css的笔记学习html&amp;css的笔记 学习html&amp;css的笔记学习html&amp;css的笔记学习html&amp;css的笔记 学习html&amp...

    html&css; - 表单

    html&css;学习 -表单的源码 包含表单和表单常用属性的讲解

    jihong10102006#blog#07、CSS基础笔记02----对齐方式1

    title: 07、CSS基础笔记02----对齐方式tags: CSDN迁移上对齐中对齐下对齐。

    HTML & CSS设计与构建网站 完整中文版带目录.pdf

    HTML & CSS设计与构建网站 完整中文版带目录.pdf 个人收集电子书,仅用学习使用,...第14章列表、表格和表单 319 第15章布局 347 第16章图像 395 第17章HTML5布局 417 第18章建站过程和设计方法 441 第19章实用信息 465

    文本域动态添加图像HTML html 文本域 文本域添加图像 图像

    在“文本域动态添加图像HTML”这个主题中,学习和掌握这些技术不仅可以提升网页的交互性,还能丰富内容的表现形式,提高用户在输入和阅读时的满意度。在实际开发中,可以根据具体项目需求,结合HTML、CSS和...

    html css js 学习笔记.zip

    html css js 学习笔记html css js 学习笔记html css js 学习笔记 html css js 学习笔记html css js 学习笔记html css js 学习笔记 html css js 学习笔记html css js 学习笔记html css js 学习笔记 html css js 学习...

    html+css前端学习笔记.zip

    html+css前端学习笔记html+css前端学习笔记html+css前端学习笔记 html+css前端学习笔记html+css前端学习笔记html+css前端学习笔记 html+css前端学习笔记html+css前端学习笔记html+css前端学习笔记 html+css前端学习...

    如何改变文本域里的字体颜色?.rar

    在网页设计中,文本域(`textarea`)是用户输入多行文本的元素,常见于表单中。有时候,为了提升用户体验或者满足特定的设计需求,我们可能需要改变文本域内的字体颜色。这个问题主要涉及到JavaScript(JS)编程,...

    html与css的学习笔记与练习.zip

    html与css的学习笔记与练习html与css的学习笔记与练习 html与css的学习笔记与练习html与css的学习笔记与练习 html与css的学习笔记与练习html与css的学习笔记与练习 html与css的学习笔记与练习html与css的学习笔记与...

    尚硅谷(李立超)——HTML5&CSS3笔记总结【持续更新】

    尚硅谷(李立超)——HTML5&CSS3笔记总结【持续更新】 本文适合前端菜鸟食用,小编自己整理的李立超老师视频的笔记,手打不易,那就望您每年快乐吧。逃) 一、进制 1.十进制(日常使用): 特点:满10进1 计数:0 1 ...

    HTML+CSS学习笔记.zip

    HTML+CSS学习笔记HTML+CSS学习笔记HTML+CSS学习笔记HTML+CSS学习笔记 HTML+CSS学习笔记HTML+CSS学习笔记HTML+CSS学习笔记HTML+CSS学习笔记 HTML+CSS学习笔记HTML+CSS学习笔记HTML+CSS学习笔记HTML+CSS学习笔记 ...

    单选按钮控制多个文本域和多个下拉菜单的可修改

    接下来,文本域(Text Area)和下拉菜单(Select Box)是常见的表单元素。文本域是`&lt;textarea&gt;`标签,允许用户输入多行文本;下拉菜单则是通过`&lt;select&gt;`和`&lt;option&gt;`标签创建的,提供一个可下拉的选项列表供用户...

Global site tag (gtag.js) - Google Analytics