平凡的天才

轉載自http://community.csdn.net/Expert/topic/5273/5273709.xml?temp=.3267176

1、<li>中的LI前面的符號不出現而且不占位置??
?????
list-style:none;

margin:0px;padding:0px;

2、CSS相對定位語法

當父對象的position為absolute或者relative的時候
子對像如果設置了position為absolute,則top,left,right,bottom相對于父對象
例子：

<div id="AAA" style="position:relative;">基準點
<div id="num1" style="position:absolute;top:50px;left:1px;">測試1</div>
<div id="num2" style="position:absolute;top:80px;left:1px;">測試2</div>
</div>

3、CSS中的對齊屬性

垂直頂部對齊（不是所有元素對這句都有效）

vertical-align:top;

水平居中對齊

text-align:center;

4、層的顯示與隱藏

<script>
function hidlayer(){
document.all.Layer1.style.display="none";
}
</script>

<div id="Layer1" style="display:block"></div>

<a href="#" onClick="hidlayer()">隱藏層</a>

5、怎么能得到<div>的高度值

document.getElementById("divID").offsetHeight

6、在<table>或<div>中如何讓傳入的文本自動換行

<div style="width:100px">
你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你你
</div>
這樣的話。div中內容。會到100px自動換行的。但是
<div style="width:100px">
cccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc
</div>
也就是其中內容是英文的話就不會換行？？？內容將會撐大直到完全顯示

?

如果你輸入的不是一連串的如:aaaaaaaaaa或！！！！！！！！這樣的無意義字符，在你指定了容器的寬度之后，是會自動換行的；
如果有大篇章這樣的字符，可以考慮使用word-break:break-all或table-layout:fixed

<div style="width:100px;word-break:break-all;">
cccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc
</div>

7、文字應該放在div里面還是p里面還是span里面呢
內容較多的時候，分多行顯示，一般會用div或者p，span一般用在行內

8、<div>與<span>有什么區別

SPAN 和 DIV 的區別在于，DIV(division)是一個塊級元素，可以包含段落、標題、表格，乃至諸如章節、摘要和備注等。而SPAN 是行內元素，SPAN 的前后是不會換行的，它沒有結構的意義，純粹是應用樣式，當其他行內元素都不合適時，可以使用SPAN

例子：
<div>1</div><div>2</div>
<span>1</span><span>2</span>

從上面例子中可以看到span是不換行的

9、如何讓頁面中的表格不服從CSS中的table布局

可以為這個表格重新定義一個樣式：background:none;

.asd{
background:none;
}

<table class="asd">
</table>

10、層的換行

很少用DIV做東西，今天碰到點問題，還是到婆家求助：
<div nowrap>
<div style="float:left">此處顯示新 Div1 標簽的內容</div>
<div style="float:left">此處顯示新 Div2 標簽的內容</div>
<div style="float:left">此處顯示新 Div3 標簽的內容</div>
<div style="float:left">此處顯示新 Div4 標簽的內容</div>
<div style="float:left">此處顯示新 Div5 標簽的內容</div>
<div style="float:left">此處顯示新 Div6 標簽的內容</div>
<div style="float:left">此處顯示新 Div7 標簽的內容</div>
<div style="float:left">此處顯示新 Div8 標簽的內容</div>
<div style="float:left">此處顯示新 Div9 標簽的內容</div>
<div style="float:left">此處顯示新 Div10 標簽的內容</div>
</div>
現在層是自動換行了，我不想讓它換行，想在一行顯示全部內容，請問怎樣設置

答：
需要為容器指定寬度，如：
<style>
ul {margin:0px;padding:2px;width:300%;border:1px solid #630;}
li {display:inline;border:1px solid #f00;}
</style>
<ul>
<li>此處顯示新 li1 標簽的內容</li>
<li>此處顯示新 li2 標簽的內容</li>
<li>此處顯示新 li3 標簽的內容</li>
<li>此處顯示新 li4 標簽的內容</li>
<li>此處顯示新 li5 標簽的內容</li>
<li>此處顯示新 li6 標簽的內容</li>
<li>此處顯示新 li7 標簽的內容</li>
<li>此處顯示新 li8 標簽的內容</li>
<li>此處顯示新 li9 標簽的內容</li>
<li>此處顯示新 li10 標簽的內容</li>
</ul>

11、為什么我表格中的背景顯示不出來

你輸出的時候應該把沒有數據的td填入一個空格或者

css遵循一個規則：沒有前景就沒有背景

12、html很多標簽都有display屬性，dipslay的值block,inline,none,list-item 分別表示什么

block :　塊對象的默認值。將對象強制作為塊對象呈遞，為對象之后添加新行
none :　隱藏對象。與 visibility 屬性的hidden值不同，其不為被隱藏的對象保留其物理空間
inline :　內聯對象的默認值。將對象強制作為內聯對象呈遞，從對象中刪除行
inline-block :　將對象呈遞為內聯對象，但是對象的內容作為塊對象呈遞。旁邊的內聯對象會被呈遞在同一行內
list-item :　將塊對象指定為列表項目。并可以添加可選項目標志

13、用css如何實現下面表格的效果

<table width="500" border="1">
<tr align="center">
<td>姓名</td>
<td>年齡</td>
<td>聯系地址</td>
<td>聯系電話</td>
<td> </td>
</tr>
<tr align="center">
<td>張三</td>
<td>22</td>
<td>深圳市福田區華強北路</td>
<td>12345678</td>
<td>編輯</td>
</tr>
<tr align="center">
<td>李四</td>
<td>25</td>
<td>不詳</td>
<td>321</td>
<td>編輯</td>
</tr>
</table>

答：
<style type="text/css">
#dydiv { border: 1px solid #aaa; float: left; }
#dydiv ul { padding: 1px ;margin: 0px; list-style: none; float: left; }
#dydiv ul li { padding: 3px; margin: 1px; border:1px solid #aaa; text-align: center; }
</style>
<div id="dydiv">
<ul>
<li>姓名</li>
<li>張三</li>
<li>李四</li>
</ul>
<ul>
<li>年齡</li>
<li>22</li>
<li>25</li>
</ul>
<ul>
<li>聯系地址</li>
<li>深圳市福田區華強北路</li>
<li>不詳</li>
</ul>
<ul>
<li>聯系電話</li>
<li>12345678</li>
<li>321</li>
</ul>
<ul>
<li> </li>
<li>編輯</li>
<li>編輯</li>
</ul>
</div>

14、鼠標停滯顯示文字

可以用對象的title 或alt屬性

也可以用下面的代碼實現

<html>
<head>
<STYLE type=text/css>BODY {
MARGIN-TOP: 0px; FONT-SIZE: 9pt; MARGIN-LEFT: 4px; MARGIN-RIGHT: 0px; FONT-FAMILY: "宋體"
}
A {
FONT-WEIGHT: 400; FONT-SIZE: 13px; COLOR: black; TEXT-DECORATION: none
}
A:hover {
FONT-WEIGHT: 400; FONT-SIZE: 13px; COLOR: red; TEXT-DECORATION: underline
}
A:active {
FONT: 9pt "宋體"; CURSOR: hand; COLOR: #ff0033
}
</style>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

</head>

<body>
<script>

function show(tips,flag,url){
var my_tips=document.all.mytips;
if(flag){
my_tips.style.display="";
if (url!=null){my_tips.innerHTML="<img src='"+url+"'align=left>"+tips;}
else{ my_tips.innerHTML=tips;}
my_tips.style.left=event.clientX+10;
my_tips.style.top=event.clientY+10;
}
else
{
my_tips.style.display="none";
}
}
</script>

<a href="#" tips="我是第一個" onmousemove=show(this.tips,1) onmouseout=show(this.tips,0)>Hello,world!</a>
<a href="#" tips="我就是第二個" onmousemove=show(this.tips,1,'http://be10.ods.org/51js/images/standard/online_member.gif') onmouseout=show(this.tips,0)>你好，中國</a>
<a href="#" tips="那我就是最后一個了" onmousemove=show(this.tips,1,'http://be10.ods.org/51js/images/standard/online_moderator.gif') onmouseout=show(this.tips,0)>永遠都好</a>

<div id=mytips style="position:absolute;width:150;height:16;border:1 gray solid;font-size:9pt;background-color:#ffffff;color:red;display:none;filter: progid:DXImageTransform.Microsoft.Shadow(color=#999999,direction=135,strength=3);">
</div>
</body>
</html>