ホームページ >ウェブフロントエンド >htmlチュートリアル >css htmlセレクター-shinepans_html/css_WEB-ITnose
css htmlセレクター-shinepans_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 11:52:391269ブラウズ
css1.css:
.s1{ /*类选择器*/ color:pink; font-size:30px; /*font-weight 粗体等 font-style normal italic:斜体 oblique倾斜的字体*/ text-decoration:line-through;}.s2{ color:red; font-size:25px; font-style:italic; text-decoration:underline;}.s3{ color:blue; font-size:20px; font-weight:bold; text-decoration:blink;}.s4{ color:yellow; font-size:15px; font-style:oblique; text-decoration:overline;}.s5{ color:orange; font-size:10px;}/*text-decoration:none,underline 下划线 blink闪烁 overline line-through*/img{ filter:gray;}/*hover 鼠标悬停时的样式*/#id1{ background-color:silver; font-size:50px; font-color:black;}#id2{ background-color:pink; font-size:30px;}#id2:hover{ background-color:yellow; font-size:50px;}#id3{ background-color:yellow; font-size:30px;} #id3:hover{ background-color:green; font-size:50px;}#id4{ background-color:orange; font-size:30px;}#id4:hover{ background-color:blue; font-size:50px;}#id5{ background-color:blue; font-size:30px;}#id5:hover{ background-color:yellow; font-size:50px;}#id6{ background-color:silver; font-size:30px;}#id6:hover{ background-color:blue; font-size:50px;}a:link{ color:black; background-color:pink; text-decoration:none; font-size:24px;}a:hover{ text-decoration:underline; background-color:yellow; font-size:40px; color:green;} html:
<html><meta http-equiv="content-type" content="text/html;charset=UTF-8"/><link rel="stylesheet" type="text/css" href="css1.css"/><center> <body> <span id="id1">css选择器之HTML选择器</span> <br/> <br/> <br/> <span id="id2">这是第二个ID</span><br/><br/> <span id="id3">这是第三个ID</span><br/><br/> <span id="id4">这是第四个ID</span><br/><br/> <span id="id5">这是第五个ID</span><br/><br/> <span id="id6">这是第六个ID</span><br/><br/> <br/> <br/> <a href="http://sohu.com">打开搜狐</a> <a href="http://baidu.com">打开百度</a> <a href="http://qq.com">打开腾讯</a> <a href="http://360.com">打开360</a> <a href="http://hao123.com">打开hao123</a> <a href="http://youku.com">打开优酷</a> <a href="http://sina.com">打开新浪</a> <a href="http://yahu.com">打开雅虎</a> <a href="http://bing.com">打开bing</a> <a href="http://microsoft.com">打开微软</a> <a href="http://jw1.hustwenhua.net">打开教务</a> <a href="http://csdn.net">打开CSDN</a> </body></center></html>
概要: CSS を使用して Web を作成するのが上手になりましょうページはもっと美しいです 美しい
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。