css3-5 css3鼠标、列表和尺寸样式怎么用（文字有关的样式会被继承）
一、总结
一句话总结：css标签中文字有关的样式会被继承。由常用样式记起。
1、鼠标常用样式有哪些？
cursor:pointer;
2、列表常用样式有哪些？
list-style-type:none
list-style-type:decimal
list-style-type:square
3、css标签中文字有关的样式会被继承，其它样式会怎样？
也会被继承，但是一般无法生效，分情况，反正快标签的宽高行标签继承了也没用。
4、如何设置一个标签的最小宽度？
minwidth属性
12 ul{
13 width:100%;
14 min-width:1200px;
5、如何去掉textarea的大小可变？
将resize属性设置为none
11 textarea{
12 width:500px;
13 height:100px;
14 resize:none;
15 }
二、css3鼠标、列表和尺寸样式怎么用
1、相关知识
鼠标:
cursor:crosshair;
cursor:crosshair;
cursor:pointer;
cursor:wait;
cursor:text;
cursor:default;
cursor:help;
列表(list-style-type):
none
disc
circle
square
decimal
lower-roman
upper-roman
lower-alpha
upper-alpha
尺寸:
1200px;
height:500px;
2、代码
样式继承
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>index</title> 6 <style> 7 p{ 8 font-size: 20px; 9 font-family: 微软雅黑; 10 color:#f00; 11 font-weight:bold; 12 font-style:italic; 13 word-spacing:15px; 14 } 15 16 </style> 17 </head> 18 <body> 19 <div> 20 <p><span>linux php linux</span></p> 21 <p><span>linux linux php linux</span></p> 22 <p><span>linux linux php linux</span></p> 23 <p><span>linux linux php linux</span></p> 24 </div> 25 </body> 26 </html>
textarea文本域
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>index</title> 6 <style> 7 *{ 8 font-family: 微软雅黑; 9 } 10 11 textarea{ 12 width:500px; 13 height:100px; 14 resize:none; 15 } 16 </style> 17 </head> 18 <body> 19 <form action=""> 20 <p>用户名:</p> 21 <p> 22 <input type="text" name='username'> 23 </p> 24 25 <p>留言:</p> 26 <p> 27 <textarea name="mess"></textarea> 28 </p> 29 </form> 30 </body> 31 </html>
min-width最小宽度
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>index</title> 6 <style> 7 *{ 8 font-family: 微软雅黑; 9 margin:0px; 10 } 11 12 ul{ 13 width:100%; 14 min-width:1200px; 15 background: #272822; 16 list-style-type:none; 17 padding-left:0px; 18 line-height:40px; 19 height:40px; 20 } 21 22 ul li{ 23 float:left; 24 margin-left:15px; 25 } 26 27 ul a{ 28 color:#fff; 29 text-decoration:none; 30 } 31 </style> 32 </head> 33 <body> 34 <ul> 35 <li><a href="">百度</a></li> 36 <li><a href="">新浪</a></li> 37 <li><a href="">网易</a></li> 38 <li><a href="">腾讯</a></li> 39 <li><a href="">淘宝</a></li> 40 <li><a href="">淘宝</a></li> 41 <li><a href="">淘宝</a></li> 42 <li><a href="">淘宝</a></li> 43 <li><a href="">淘宝</a></li> 44 <li><a href="">淘宝</a></li> 45 <li><a href="">淘宝</a></li> 46 <li><a href="">淘宝</a></li> 47 <li><a href="">淘宝</a></li> 48 <li><a href="">淘宝</a></li> 49 <li><a href="">淘宝</a></li> 50 <li><a href="">淘宝</a></li> 51 <li><a href="">淘宝</a></li> 52 <li><a href="">淘宝</a></li> 53 <li><a href="">淘宝</a></li> 54 <li><a href="">淘宝</a></li> 55 <li><a href="">淘宝</a></li> 56 <li><a href="">淘宝</a></li> 57 <li><a href="">淘宝</a></li> 58 <li><a href="">淘宝</a></li> 59 <li><a href="">淘宝</a></li> 60 <div style='clear:both'></div> 61 </ul> 62 </body> 63 </html>