關於HTML與CSS的學習

版權聲明:本文爲博主原創文章,未經博主允許不得轉載。 https://blog.csdn.net/wq1134302142/article/details/52730722

html的介紹

html:hyper transfer markup language –超文本標記語言
我們學習這個主要是爲了做頁面的。學習html實際上就是學習其中的一些標籤以及標籤中的一些屬性。
1.1 那麼問題來了,要學習哪些標籤呢?
首先有一點要明確,就是html是由w3c組織維護的,也就是說這種語言肯定是有一套標準的,那麼html中的標籤都是預先定義好的,所以不能瞎寫。
其次html是一種標記語言,都有其默認的擴展名。.html 或者是 .htm
最後明確一點,學習任何一門語言,都會有相應的技術文檔,。查看api文檔,才能更好的去學習這種語言。
1.2開發工具的介紹
hBuilder開發工具。是基於eclipse做的二次開發。
1.3html的一些具體標籤的學習
1.3.1 排版標籤
:表示解釋說明

: 主要是處理段落之間,爲字、畫、表格等之間留一空白

換行標誌,顯示下一行


插入一條水平線
1.3.2 字體標籤
:加重語氣,產生字體加粗的效果
:粗體標誌,字體加粗
:斜體標記,字體出現斜體效果
:加上底線,字體下面加上底線
:下標字。可以進行化學方程式的下標書寫
:下標字。指數。可以進行數學公式的冪指數的書寫
文字
1.3.3圖片和超鏈接標籤:

src:指定要顯示的是哪個圖片,路徑。
width:寬度,單位用px 也可以用百分比
height:高度. 單位用px 也可以用百分比
align:調整位置。
點擊< /a>
href:用於指定點擊後跳轉到哪個頁面
target:用於指定打開頁面時候,打開的方式,其中,_self —-》默認值在當期頁面打開,會覆蓋原有頁面
_blank—>打開新的頁面不會覆蓋原有頁面。
1.3.4表格標籤
< table>是一個容器,就是一張表 表的 大小 距離,顏色等都可以在這個標籤裏面設置。
< td>:表示一列
< th>:表示一列(裏面的文件是粗體)
< tr>:表示一行

CSS的介紹

2.1css概念
css—>cascading style sheet ==層疊樣式表 主要用來控制html頁面中顯示的效果
當css與div結合產生了js技術
div+css —XHTML+CSS技術—js
當html與js技術結合又產生了dhtml技術,使得web開發越來越強大
html+css+js===dhtml技術
2.2css與html的結合方式
2.1.1所有的html的標籤都有style的屬性,通過這個屬性可以去寫css代碼
< div style=”backgroud-color : black;”>div區域一< /div>
2.1.2將css的代碼通過< style 標籤提取出來
< style type=”text/css”>

        div{

            background-color: red;
        }

    </style>
</head>
<body>
    <div>
        div區域一
    </div>
    <div>
        div區域二
    </div>
    <div>
        div區域二
    </div>
</body>

`2.1.3通過引入外部寫好的css代碼來實現控制效果
< link rel=”stylesheet” href=”css/main.css” />
< style>

@import url(“css/div.css”);
< /style>
2.2三種入門選擇器
2.2.1標籤名選擇器
< style type=”text/css”>

        div{

            background-color: red;
        }

    </style>
</head>
<body>
    <div>div區域一</div>
< /body>

2.2.2 class選擇器
.odd{

            background-color: antiquewhite;
        }

        .even{

            background-color: aquamarine;
        }


    </style>
</head>
<body>
    <div class="odd">
        div區域一
    </div>
    <div class="even">
        div區域二
    </div>
    <div class="odd">
        div區域三
    </div>
    <div class="even">
        div區域四
    </div>

2.2.3 id選擇器 主要針對單獨的某個標籤而言
#first{
font-family: “微軟雅黑”;

        }

    </style>
</head>
<body>
    <div class="odd" id="first">
        div區域一
    </div>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章