ddjmvp

导航

studyLog_test

11.21
<body>
<a href = "http://baidu.com" target="_blank">百度</a>;
<img src="xxx.gif">//输出图片,如果图片和HTML文档不在同一个文件夹，则需要提供相应的访问路径.
</body>
 
<form></form>是表单标签，在这个标签中的用户输入会被提交给服务器，语法类似
<form action =" " method="get"></form>//method除了“get”属性还有post，前者的用户输入会在地址栏上出现，后者则不会且使用的数据量比较大
 
<!---三种常用的对话框--->
function alertDialog(){}
function confirmDialog(){
     if(window.confirm("你确定要进行操作吗")){
          alert();
     }
     else{
          alert();
     }     
}
function promptDialog(){
     var input = window.promt("请输入内容：");
     if(input != null){
          window.alert();
     }
}
html文档的源文件以.html或.htm为后缀名.
 
               <span style="cursor:hand">hand shape</span><br>
               <span style="cursor:move">move</span><br>
               <span style="cursor:ne-resize">negative direction</span><br>
               <span style="cursor:wait">wait</span><br>
               <span style="cursor:help">help</span><br>
               <span style="cursor:text">text</span><br>
               <span style="cursor:crosshair">crosshair</span><br>
               <span style="cursor:s-resize">aro</span><br>
样式的属性(attribute)
11.26
e.g.，style="color:red;font-size:20px;background-color:yellow;font-family:Arial;text-align:center"
新tag：table
<tr>
colspan//合并列
e.g.,<th colspan="2">Famous Monsters by Birth Year</th>产生如下效果
Famous Monsters by Birth Year
Famous MonsterBirth Year
King Kong 1933
Dracula 1897
Bride of Frankenstein 1935
可见，"Famous Monsters by Birth Year"从本来只占1列的位置（左列），通过colspan合并成2列
 
 <table border="1px">和<table style="border-collapse:collapse">//注意区别
<th style="padding:5px;border-left:1px solid black;">
11.28
 <a href="http://www.baidu.com"><div style="width:50px; height:50px; background-color:yellow"></div></a>
产生效果如下
现在学习到<span>,它是用作修饰某个区域的样式属性而用的
<div>则是用来将页面（pages）divide to 容器（container）
 
11.29
table {
     border: #000000 1px solid;
     background-color: #acd1b2;
     float: right;
     margin-right: 10px;
     border-bottom-right-radius: 15px;//table的左下角变圆，数字为圆的半径大小
     border-bottom-left-radius: 15px;//table的右下角变圆，数字为圆的半径大小
}
<link type="text/css" rel="stylesheet" href="path of css">//path of css 即是css层叠样式表所在的位置，如果和html同一文件目录下，填css的文字加后缀即可
<a href="url">文字</a>通常会以 文字 的结果出现，在css中可以在a{}里修改color颜色，和text-decoration：none把下划线去掉
11.31
css 后代选择器 e.g. div div h1{color:black}//即选div嵌套内的div里的所有h1（如果有更深层次的嵌套，也包含在内）
css 子元素选择器 e.g. div>h1{color:black}//即选div嵌套内的那一层里的h1（如果有更深层次的嵌套，不包括在内）
 
12.02
类选择器
html:<h1 class="important">This heading is very important.</h1>
css:  .important{color}
可同时结合多类的选择器，如
<p class="important warning">//以空格分隔，修改css时用 .important.warning,且在html元素中同时存在两个类选择器才能修改
 
a:link: An unvisited link.
a:visited: A visited link. 
a:hover: A link you're hovering your mouse over.
加入a:link 和a:visited和a:hover同时存在，则a:hover不会应用在已点击过（a:visited）的链接上，如果没有a:visited则可以
 
p: first-child{}//用途：p段落的第一个元素使用样式
p: nth-child(2){}//用途：p段落的第二个元素使用样式
12.03
display样式的部分属性
block：将元素放进一个box里，并且不容许其他元素在同一行内靠近（即占据整行）
inline-block：将元素放进一个box里，但是容许其他元素靠近
inline：允许其他元素在同一行内靠近
none：让元素和其内容从页面上消失
 
padding和margin区别，如图
 
css样式
float:left   //将样式放在左边
 
css样式
clear:left //将该元素移至左方任何float元素下方，下面意思相同
clear:right
clear:both//将该元素移至任何元素元素的下方
 
认识CSS中absolute与relative
12.04
浏览器窗口的文档对象模型

posted on 2013-12-09 19:58  ddjmvp  阅读(151)  评论(0)    收藏  举报