溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

CSS結構的基礎認知

發(fā)布時間：2020-06-17 14:16:30 來源：網絡 閱讀：519 作者：A追途 欄目：web開發(fā)

css的屬性值與html的屬性值用法不相上下，但是css主要分為內聯(lián)樣式表和外聯(lián)樣式表。

內聯(lián)樣式表用法：在html文件中的《head》頭文件中添加<style></style>標簽，在標簽內添加所需的屬性值，例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
</style>
</head>

外聯(lián)樣式表用法：在同一項目的目錄下創(chuàng)建css為拓展名的文件，在文件編寫所需屬性和個人style，在HTML內編寫代碼：<link rel="stylesheet" href="文件名" />進行調用。

CSS樣式表規(guī)則中class標記和超鏈接的用法：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
p.first{text-indent: 0.5in;}
p.second{text-indent: 1.0in;}
.main01{font-size: 10pt;color: red;}
#01{font-size: 10pt;color: yellow;}
#02{font-size: 12pt;color: blue;}

        //屬性：link鏈接本身;visited被訪問過時;hover指向時;
        a:link{font-size: 10pt;color: blue;text-decoration: none;}
        a:visited{font-size: 13pt;color: gray;text-decoration: underline;}
        a:hover{font-size: 16pt;color: red;text-decoration: overline;}
    </style>
</head>
<body>
    <!--創(chuàng)建class-->
    //<標記 class="類名"></標記>
    //直接用class定義段落的縮進大小
    <p class="first">這個段落縮進0.5in</p>
    <p class="second">這個段落縮進1.0in</p>

    //<標記 class="類名"></標記>
    //調用.main01定義段落和單元格的屬性
    <p calss=".main01"></p>
    <td calss="main01"></td>

    //<標記 id="id名">
    <font id="01">php是世界上最好的語言</font>
    <font id="02">php是世界上最好的語言</font>

    <!--超鏈接-->
    <a >first</a>
    《style中的屬性一一對應body中class和超鏈接的用法》

這是一些關于css的屬性注釋：
/文本對齊/
h2{text-align:center}
/文本縮進/
h2{text-indent: 50px;}
/行高/
body{line-height: 120%;}
/字間距/
body{letter-spacing: 0.1cm;}
/文本裝飾/
h4{text-decoration: underline;}
/垂直對齊/
<p>平方值:3<font style="vertical-align:super">2</font></p>
/文本變換/
p{txet-transform:capitalize}

向AI問一下細節(jié)

免責聲明：本站發(fā)布的內容（圖片、視頻和文字）以原創(chuàng)、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經查實，將立刻刪除涉嫌侵權內容。

AI
助
手