html部分笔记

ol li 表示有序列表   

如:<ol>

<li>这是一个有序列表</li>

</ol>

dl dt dd表示自定义列表 

如:<dl>

<dt>每个自定义列表项以dt开始</dt>

<dd>每个自定义列表项的描述以dd开始</dd>

</dl>

iframe 用来规定一个内联框架,一个内联框架被用来在当前HTML文档中嵌入另一个文档

提示:你可以把需要的文本放置在 <iframe> 和 </iframe> 之间,这样就可以应对不支持 <iframe> 的浏览器(一些旧的浏览器不支持iframe)

<iframe src="http://www.baidu.com" width="100px" height="100px">这里可以放入文本</iframe>

定义<iframe> 标签是否显示边框

frameborder 属性用于定义 <iframe> 是否显示边框。

frameborder 属性默认值为“1”,表示开启边框。设置 frameborder 属性值为 "0" ,则表示移除 <iframe> 的边框

如:<iframe src="http://www.baidu.com" width="100px" height="100px" frameborder="1">

HTML5 不支持 <iframe> frameborder 属性,请使用 CSS 设置样式代替。

HTML 脚本标签

<script> 定义了客户端脚本

<noscript> 定义了不支持脚本浏览器输出的文本

常见的HTML实体列表

提示:虽然 HTML 不区分大小写,但实体名称对大小写敏感。

HTML 表格

HTML 表格由 <table> 标签来定义

一个 HTML 表格包括 <table> 元素,一个或多个 <tr>、<th> 以及 <td> 元素。

<tr> 元素定义表格行,<th> 元素定义表头,<td> 元素定义表格单元。

例如<table border="1" cellspacing="0" cellpadding="0">

<tr><th>姓名</th><th>手机号</th></tr>

<tr><td>邱彦兮</td><td>18888628835</td></tr>

</table>

border-collapse: collapse  可以使表格属性变更细


HTML <form> 标签 收集用户的数据

表单是一个包含表单元素的区域。

表单元素是允许用户在表单中输入内容,比如:文本域(textarea)、下拉列表、单选框、复选框等等

使用方法:

<form action="" method=>

表单项  input  select  label  textarea

</form>

form相关属性:

action:表单提交的地址

methon:表单发送的方式

                get  显式 把数据放在浏览器地址栏 发送过去 可以在浏览器地址栏看到发送的内容

                post  隐式提交不可见

涉及到数据库修改的用post  查询用get

name属性:通用属性,可以加在任何标签上

文本:input type="text"

密码:input type="password"

普通按钮:input type="button"  value:登录

提交按钮:input type="submit" value:登录

单选按钮:input type="radio"  name=相同才可以

复选按钮:input type="checkbox"

上传文件:input type='file'

下拉列表  select option 合用,类似于ul li 

文本域:textarea  我们可以通过 colsrows 属性来规定 textarea 的尺寸大小。

                cols 属性规定了文本区域内可见的宽度,rows属性规定了文本区域内可见的高度(以行数计)

placeholder  占位符 <input type="text" placeholder="this is placeholder text">

对于表单,你可以指定某些选项为required(必填项),只有当用户填写了该选项后,用户才能够提交表单。例如,如果你想要一个文本输入框设置为必填项,你可以在 input 元素中加上 required 属性,你可以使用: <input type="text" required>

HTML <label> 标签: <label> 标签定义了 <input> 元素的标签,一般为输入标题。

<label> 标签的 for 属性应当与相关元素的 id 属性相同

作用:扩大选区     

代码:<form action="" method="">

<label for="sex">

男:<input id="sex" type="radio" name="sex" id="" value="" />

</label>

<label>

女:<input type="radio" name="sex" id="" value="" />

</label>

</form>

HTML <button> 标签

<button> type 属性值有:

submit:该按钮是提交按钮(除了 IE 浏览器,该值是其他浏览器的默认值)。

button:该按钮是可点击的按钮(IE 浏览器的默认值)。

reset:该按钮是重置按钮(清除表单数据)

HTML <fieldset> 和 <legend> 标签

<fieldset> 标签定义了一组相关的表单元素,并使用外框包含起来。

<legend> 标签定义了 <fieldset> 元素的标题。

代码如下:

<form action="http://www.baidu.com" method="">

<fieldset id="">

<legend>标题</legend>

<label for="sex">

男:<input id="sex" type="radio" name="sex" id="" value="" />

</label>

<label>

女:<input type="radio" name="sex" id="" value="" />

<button type="submit">我是一个可发送数据的按钮</button>

<button type="button">我是一个按钮</button>

<button type=" reset">我可以重置表单</button>

</label>

</fieldset>

</form>

CSS 覆盖:

!important >内联样式(style)>id>class

如下图:

CSS覆盖顺序

*{}  星号选择器

表示所有的元素样式

清除浮动的方法

清除浮动方法

margin无效的解决方法

外层盒子加边框:

border:solid 1px transparent(透明)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,163评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,301评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,089评论 0 352
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,093评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,110评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,079评论 1 295
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,005评论 3 417
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,840评论 0 273
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,278评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,497评论 2 332
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,667评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,394评论 5 343
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,980评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,628评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,796评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,649评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,548评论 2 352

推荐阅读更多精彩内容

  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 3,887评论 0 0
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,240评论 1 41
  • HTML5 标签comment 注释标签用于在源文档中插入注释。注释内容不会被浏览器显示。为代码编写注释的好处是...
    才気莮孒阅读 4,055评论 1 25
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,748评论 1 92
  • 0.B/S结构 浏览器服务器模式,web浏览器是客户端最主要的应用软件.将客户端使用web进行统一,系统功能实现集...
    liusong007阅读 1,056评论 0 1