黑马程序员-html基础

---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流！ ----------------------

所有内容都包含在内,是页面的头部信息,是标题栏信息,title必须在head内,是页面的主体.

可以输入空格

在所有页面中都必须有这个部分,由于现在的浏览器贞错性强,即使在不写这些内容,页面也能正常显示,但最好养成习惯写完整.

Body有一个bgcolor的属性,修改网背景颜色.

Html和Xml的联系与区别

 

 

Html中的特殊符号:

Html中不把” ”当成空格,当成空格的话影响排版,html中的空格用 表示.

<(小于号,less than)  >(大于号 greater than) 

 

文件格式的标签:

回车,

是分段,

前后会有大段空白,而
则没有.

耒阳居中显示

H标签,在html中定义了

、

、

、

、

、

六个不同的标签,分别表示不同的字体

a字体加粗

字体标签,红色,字体大小

URL超链接

优米网

中还可以嵌套图片

的target属性设定为”_blank”就是在新窗口打开页面

超链接深入

“/”表示根目录.   “../”表示父目录  “../../”表示父目录的父目录.

“./”或者不写任何斜线表示相当于当前路径的目录,

 注意图片是链接的,不是插入的,所以如果src指向的文件被删除了,就不能观看了.
alt为图片无法显示时显示文字
border属性为图片边框,border="0"为不显示,width和height指定图片的大小
列表和表格

建表
建行 属性:align,水平对齐,可选值left(左对齐),right(右对齐),center(居中对齐);
                   valign,垂直对齐,top(顶端对齐),middle(中刘对齐),bottom(底部对齐)
建单无格 属性:属性同上
指定表头
还可以使用rowspon,colspan进行单元格合并,表头用th这样表头会居中加粗 colospan="2"合并两个单元格


优米网

显示dsdd显示

姓名	年龄	性别
shuaige	22	男
百度一下你就知道	未知	娘

表单
标签为表单标签,如果需要把数据提交到服务器中,则要将 <select> 等表单元素放在from中<br> <input>是主要的表单元素, type的可以选值, text(文本输入框) checkbox(复选框) button (普通按扭) submit(提交按钮) image(图片框)<br>                                    password(密码输入框)  file(文件选择框) radio(单选 按钮) reset(重置按钮) hidden(隐藏字段)<br> <span style="white-space:pre"></span>submit:默认按钮名称为提交可以通valus="按钮名"来更改名称.<br> <span style="white-space:pre"></span>text: size属性为宽度  maxlength为最长字符数  value为值   readonly设为只读属性  <br> <span style="white-space:pre"></span>checkbox: checked属性是否选中(有且只有一个属性)<br> <span style="white-space:pre"></span>radio:  可以用name属性来进行分组(实现一组对中只能选中其中一个)<br> <span style="white-space:pre"></span>file:  用到file则 需要把from的enctype属性设置为multipart/from-data ,mothod属性为post<br> <span style="white-space:pre"></span>image: 用src属性来指定按扭的图片<span style="white-space:pre"> </span><br>         对于只有单一属性值的属性,可以只写属性名(标准的写法需要写全,也推荐写全)<br> 缩略图,通过两个图片来实现,单点击小图,转到大图<br> <select>标签  用来创建类似于winfrom的ComboBox(下拉列表)和ListBox(列表)<br> <span style="white-space:pre"></span>     通过改为size的值来确认列表类型,size>1为ListBox(size的值为显示的数量),否则就是ComboBox<br> <span style="white-space:pre"></span>     multiple属性就是多选ListBox(显示全部列表项),可以选多个项<br> select中option<br> <option>"所有添加的项"<option>   option中有一个value的属性为程序员看到的值,"添加的项"则是给用户看的值<br> option中设默认选中的值属性为selected="selected", 不让选中把value="-1"设置为-1<br> <br> <br> <br> <br> select中的optgroup  给几个项分组<br> <optgroup label= "zuming"><br> <option>sds</option><br> </optgroup><br> <br> <br> 其他标签<br> <textarea>多行文本框(也是表单元素)<br> <textarea>文字    rows   cols 表示行数和列数


 在 前面可以写修饰的普通文本,用户单击文本并不会使input得到焦点,这时候就需要用到label,使用lable的
for属性指定要修饰控件的id  

 GroupBox效果   将控件划分在一个区域内
   

相当于标题

样式表  CSS(层叠样式表)
 CSS,  用于美化页面用的,   对页面元素进行描述  字体大小 颜色    背景色 边框  等等的设置
CSS 主要有 元素内嵌  页面嵌入 和 外部引用 三种方式,  
元素内嵌,直接将元素写入style属性中,例:   适用于样式没有复用的场合
页面嵌入: 在头内写入
                     
                  表示页面内的所以input都用指定的样式,适合于样式复用,减小页面体积 
外部引用,将CSS内容写到.css后缀的文件中
textarea{background.yellow}
在页面中引用,head头部中加入

适用于多个页面共享CSS
在Css写的方法  控件名{  属性}

div(层)  span(块)
div 把多个内容包成一个整体,可以把div当成一个整体来处理,比如隐藏,移动,修改
span 也是把多个内容集合成一个整体, 当只占被包的内容区域,不会改变原始的排版,div则占整行
div是把内容放在一个矩形中,会影响整体布局,而span是把一段内容定义成一个整体,不会影响布局.显示




常见样式
css计量单位:css中表示高度,距离时有多种计量单位:px(像素)  30%(百分比)  em(相对单位)等.
background-color:red背景颜色; color:文本颜色
border-style;solid 边框风格(默认没有边框),实线  还有dotted(点)等值; border-color 边框颜色  border-width:3px边框宽度(默认为0) 
display: 元素是否显示,可选值none(不显示)  block(显示为块级元素,此元素前后会事有换行符)  inline(显示为内联元素,元素前没有换行符)等.
cursor,鼠标在元素上时显示的光标图片,可选值:cursor(默认光标)  pointer(超链接上的手)  text(输入bean)
wait(忙 沙漏)   help(帮助)等.
LI不显示圆点. LIST-STYLE-TYPE:none;一般设在N或UL上\




样式选择器  
对于非元素内联的样式需要定义样式选择器,通俗的说就是这个样式适合于哪些元素,三种:标签选择器  class选择器和 id选择器
标签选择器 input{border-color:yellow;color:red;},对于指定的标签采用统一的样式,
calss选择器 以义一个命名的样式,然后 在用到它的时候设定元素的class属性为样式的名称,还可以同时设定多    个class,名称之间加空格(类似于C#的中类的调用)
   样式名称开头加"."
   
           
   

dlkfdsl

           
标签+class选择器 
class选择器也可以针对不同的标签,实现同样的样式名对于不同的标签有不同的样式,只要在样式名前加标签名即可.
input.accountno{text-align:right;color:red;}
label.accountno{font-style:italic;}



3333


id选择器
为指定的id设定样式,id前加#
#username
{
  font-size:xx-large;
}

要显示的文字

style class可以同时组合使用

更多选择器 
@关联选择器
p strong{background-color=:yellow}
表示P标签内的strong标签内的内容使用的样式
分水岭

sdfsd

组合选择器,同时为多个标签设定一个样式
H1,H2,input{backgournd-colo:green}

nihao

伪选择器:为标签的不同状态设定不同的样式:
A:visted: 超链接点击过的样式; 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: none}










html中注释用

---------------------- Windows Phone 7手机开发、.Net培训、期待与您交流！ ----------------------