Css样式的html选择器,类选择器,id选择器

<!DOCTYPE html>
<!--
            HTML是标记语言,把属性这些写在里面并不规范,有可能无法显示
            CSS为了规范每个标记的样式,属性等设置控制能力远飞HTML所能比的
            CSS分离了内容与表现形式
            CSS语法,由选择器,属性,和值三部分组成,简单明了,在头部的<style type="text/css"></style标签内
        -->
<html>
    <head>
        <meta charset="UTF-8">
        <title>css1</title>
        <style type="text/css">
            
            h1{
                text-align: center;
                font-size: 18px;
            }
            a{
                text-decoration: none;
            }
            .txt{
                border: 1px;
            }
            .btn{
                color: red;
            }
            #mytale{
                width: 586px;
                height: 586px;
            }
            #mytd{
                font-style: italic;
            }
        </style>
    </head>
    <body>
        <h1>这里是HTML选择器</h1>
        <h1>如果使用html选择器那么所有的HTML标签将具有相同的属性样式,格式为标签名加括号</h1>
        <a href="#">这里是a标签</a>
        <a href="#">*{样式代码} 表示所有的标签都具有相同样式</a>
        <form>
            <input type="text" class="txt" value="这里是名为txt的内选择器" />
            <p>如果具有相同的class属性值的的都会生效 格式为 点加上class属性值</p>
            <input type="button" class="btn" value="这里是名为btn的内选择器" />
            <table id="mytale">
                <tr>
                    <td>单元格</td>
                    <td>每个标签的id是唯一的所以id选择器是唯一设定单个标签的样式的</td>
                </tr>
                <tr>
                    <td id="mytd">id选择器用#号加上id值</td>
                    <td>而类选择器的class值是可以重复的</td>
                </tr>
            </table>
            
        </form>
    </body>
</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章