美文网首页
html笔记

html笔记

作者: 浮巷旧人 | 来源:发表于2018-04-27 22:50 被阅读0次

不成对出现的标签 <br> <hr> <meta><img><input..><option..><link>

<p>标签  段落标签    <h1>--<h6>仅仅用于标题文本,

<strong>   用于强调文本 强度更深 表示重要文本  <b>标签  视觉加粗效果 单纯为了产生加粗  

<em>用于强调文本  <i>只是视觉斜体效果  <strong>比<em>强调更强

&nbsp; —->空格  &gt—>大于号   &lt—>小于号  &quot—>大于号

<span>对被用来组合文档中的行内元素  当对它应用样式时,才会产生视觉上的变化

<pre>文字的格式按源码的排版来显示,我们称之为预处理格式

<a>他有一个必不可少的属性 href

target属性  _self(在原来页面打开)  _blank(新窗口打开)

_top(打开时忽略所有的框架)_parent(在父窗口中打开)

创建锚点和锚链接

锚点也是一种超链接,是页面内进行跳转的超链接

第一步:创建锚点  <a  name = “锚点名称”></a>

第二步:使用创建好的锚点名称 <a href="#锚点名称">内容</a>

常见图片格式jpg png  gif    Gif只支持全透明)Jpeg/jpgPng半/全透明都支持

图片标签写法 :<img src=""  alt=""  width=""  height=""/> 

图片四要素:

src=""图片路径

alt=""图片含义

width=""图片宽度 和图片大小保持一致

height=""图片高度 和图片大小保持一致

title=""

路径知识:

相对路径、绝对路径:

相对路径:(Relative Path) 相对于该文件的路径;

绝对路径:(Absolute Path) 从磁盘出发的路径;

<img src=" ".....align=""/> align属性–设置图片与后面文字的位置关系

值–top、bottom、middle、absmiddle、left、right

/开头表示根目录;

./表示当前目录;(斜画线前面一个点)

../上级目录;(斜画线前面两个点)

直接用文件名不带/也表示同一目录

这些都是相对于当前文件的位置来说的,如果用绝对路径的话就是写全了。

  <ul> 无序列表

无序列表是一个没有顺序项目的列此列表项默认粗体圆点进行标识

<ol>有序列表

有序列表也是一列项目,只是列表项目使用的是数字进行标记。 有序列表始于<ol>标签。每个列表项始于<li>标签

无序列表-列表符号:

type="circle"空心圆type=“disc”实心圆 默认值type="square"方块符

有序列表-列表符号

type="A" A B C D

type="a"  a b c d

type="1" 1 2 3 4  默认值

type=”I” I II III  type=”i” i ii iii  罗马数字标识

定义列表以 <dl>标签开始 每个定义列表项以 <dt>开始 每个自定义列表项的定义以 <dd>开始 

<dl></dl>用来创建一个普通的列表,

<dt></dt>用来创建列表中的上层项目,

<dd></dd>用来创建列表中最下层项目,

<dt></dt>  和<dd></dd>都必须放在<dl></dl>标志对之间

<form>表单标签

<form>

<input type ="text"/>

</form>

<form action=“html.do" method="get">

        username: <input type ="text" name="users"/>    

        <input type="submit" value="提交"/>

</form>

<input>标签的掌握

 常用type类型:<input type="" name="" value=”“/>

type="text"单行文本输入框

type="password"密码(maxlength="")

type="radio"单项选择(checked="checked")

type="checkbox"多项选择

type="button"按钮

type="submit"提交type="image"图片提交

type="file"上传文件

type="reset"重置

type="hidden"隐藏

<lable>元素不会向用户呈现任何特殊效果。标签的for 属性应当与相关元素的 id属性相同。

<lable for="male">男: </lable> <input type="radio" name="sex" id="male"/>

<lable for="nv”>女:</lable><input type="radio" name="sex"  checked="check">

<textarea>文本域标签    rows表示这个文本域有多少行   cols表示这个文本域有多少列

<select>

<form>

     <select name="" id="">

     <option value="1">1月</option>

      </select>

</form>

<table>的border属性不能少

<tr>可以定义表格中的一行 

<td>  表示一个单元格

border-collapse属性设置是否将表格边框折叠为单一边框:

border-collapse:collapse;

colspan左右合并

rowspan上下合并

第一部分总结:

非可视化标签:headmetastylescrpit...

可视化标签:imgdivspanaulli…

只有可视化标签,才能用css改变它

单标签:metalinkbaseimginputbrhr

双标签:htmlheadbodydivapspan..ullioldl….

常用可视化标签

div

一般用它来布局

a超链接标签

href*属性:设置跳转的网页地址

target属性:设置跳转的目标

结论:凡事页面可以点击跳转或者表单提交的文字,都用a标签

img

src*属性用来设置图片的url数据

alt提供给搜索引擎搜索的

width

height

结论 :显示图片

ul li

列表

结论:只要将来设计页面中有固定样式的列表,就用ul和li

tablecaptiontrtd (th)

慢慢已经被淘汰了 被ul li代替

如果是合并竖排的就是合并行(rowspan)

如果是合并横排的就是合并列(colspan)


相关文章

网友评论

      本文标题:html笔记

      本文链接:https://www.haomeiwen.com/subject/iqdgkftx.html