• HTML总结


    Html

    1.所谓的Trident引擎就是IE的WebBrowser控件。很多非IE核心的浏览器用的是Webkit引擎,比如遨游3,或搜狗的双核,chrome,safari,塞班。Gecko内核,火狐浏览器。

    2.Html中的属性值可以用‘’,“”甚至不用引号。

    3. &nbsp  (no break space)  空格

    &alt                   <

    >                    >

    用这些特殊的字符是为了防止被误认识别为标签

    <pre></pre>           表示计算机的源代码,可定义预格式化的文本,被包围在 pre 元素中的文本通常会保留空格和换行符

    <br/>只是回车

    <p></p> 是分段,<p>前后会有比较大的空白,而<br/>则没有。

    <h1></h1> 从h1到h6

    <font  size=30  color="red"></font> 字体标签

    URL:表示地址栏里的东西。

    <a  href="www.baidu.com"> </a>  超级链接(超链接中还可以嵌套图片这样就是点击图片打开连接<a  href=XXX> <img  src="XXXX"/></a>)

    Src:一般表示图片的路径

    相对URL:相对URL表示相对于当前文档的资源,"/"表示网站根目录,“.. /”表示父目录,“.. /.. /”表示父目录的父目录,“. /”或者不写任何斜线表示相对于当前路径的目录。站内引用最好用相对URL,这样域名,目录改变了都不受影响。

    <a>的target属性设定为“_blank”就可在新的窗口打开新的链接

    <a> <img src="c:/img/2.png" width="50" height="50"/></a>

    这样可以实现把图片放大功能

    好一点的解决方案是:<a href="/image/2.png"> <img src="/image/2_small.png"/></a>

    实际上就是两张图片,点击小图时会链接到一张大图

    <ul><li>  </li></ul>无序的列表

    <ol></ol>  有序的列表

    <table></table> 表示表格

    <tr></tr> 表格的行

    <td></td> 表格的单元格

    Align="right"  表格内文本的对齐方式

    子标签会覆盖父标签的属性。

    4.表单   <form>

    如果要把数据提交到服务器,需要将<input>,<textarea>,<select>等表单元素放到form中。

    (1)<input> 是主要的表单元素,type的可选值:submit(提交按钮)、button(普通按钮)、hidden(隐藏字段)、image(图片按钮)、password(密码框)、checkbox(复选框)、file(文件选择框)、radio(单选按钮)、reset(重置按钮)、text(文本框)。

    (2)Radio的互斥是通过名字name来实现的。

    <input type="radio"  name="gender"/>男

    <input type="radio"  name="gender"/>女

    (3)file:使用file,则form的enctype属性必须设置为multipart/form-data、method属性为POST,这样才可以提交给服务器。

    (4)<select>标签:用来创建类似于winform中的combobox或者LIstBox。如果size属性大于1就是ListBox,否则就是comboBox。<select  multiple>或者<select  multiple="multiple">那么就是可以多选的listbox。

    <select>

    <option> 北京/option>

    <option> 天津</option>

    <option> 武汉</option>

    <select/>

    (5)<textarea>多行文本(也是表单元素):cols、rows属性表示列数和行数

    (6)Label

    <label for="name">姓名:</label><input id="name" type="text" />

    <label for="ma">婚否:</label><input id="ma" type="checkbox" />

    (7)<fieldset></fieldset>将一些控件框起来

    例如:<fieldset>

    <legend >常用</legend>

    <input type="text"/>

    <input type="text"/>

    <input type="text"/>

    </fieldset>

    wps_clip_image-17772

    5.CSS

    (1)使用css三种方式:a.直接style写在标签内部  b.style写在<head>标签内  c.样式写在单独的一个文件中

    a.<input type="text" style=" background-color:Red;text-align:left;"/>

    b.<head>

    <title></title>

    <style type="text/css">

    input{ background-color: Black; border-color:Green;}   

    </style>

    </head>

    C.直接写在一个样式表文件中。

    (2)css中宽度,距离计量单位:px,百分比(20%),em(相对单位)

    (3)Color:表示文本颜色

    (4)Cursor:鼠标在元素上时显示的光标图标,可选值:cursor(默认光标)、pointer(超链接上的手)、

    Text(输入bean)、wait(忙沙漏)、help(帮助)等。

    自定义光标:cursor:url(图片路径),图片的格式必须为.cor和.ani

    (5)li 去掉前面的圆点  list-style:none

    6.样式选择器

    三种选择器:标签选择器,class选择器,id选择器。

    (1)在用class选择器时可以用一种以上的选择器 如:<div class="nav footer"></div>

    两个类中间用空格隔开。

    (2)样式的优先级:style的级别高于class样式的级别。

    (3)标签选择器+class选择器

    格式:标签的名字.class的名字{样式内容}

    如:input.acto{text-align:right;color:red;}

    label.acto{font-style:italic;color:black;}

    (4)id选择器

    例如:#username

    {

          Font-size:20px;

    }

    <input id=username type=text/>

    (5)关联选择器

    描述某一个标签在另一个标签内部长什么样

    P strong{ color:red;}在p标签下得strong标签中的内容的样式

    (6)组合选择器

    几种标签都采用同一种样式。如:

    P ,h1,input { color: green;}

    (7)伪选择器

    为标签的不同状态设定不同的样式:

    A:visited:超链接点击过的样式; A:active:选中超链接时的样式; A:link:超链接未被访问时的状态;A:hover:鼠标移到超链接时的状态。

    A:visited{ TEXT-DECORATION:none}

    A:active{ TEXT-DECORATION:none}

    A:link{ TEXT-DECORATION:none}

    A:hover{ TEXT-DECORATION:underline}

  • 相关阅读:
    (转)我是怎么治愈鼻窦炎的
    Linq to SQL 资源
    桥牌笔记:忍让几墩?
    读书笔记2013第1本:餐巾纸的背面
    《Two Dozen Short Lessons in Haskell》学习(十五) Encapsulation — modules
    《Two Dozen Short Lessons in Haskell》学习(十三)迭代及重复的常规模式
    读书笔记2013第4本:《上帝掷骰子吗?》
    用Haskell写的卡普雷尔卡kaprekar黑洞小程序
    读书笔记2013第5本:《拖延心理学》
    使用Supermemo背单词6周年了
  • 原文地址:https://www.cnblogs.com/yichengbo/p/2151222.html
Copyright © 2020-2023  润新知