HTML、CSS學習-標籤(一)

1、html有哪些標籤?

2、css裏有的哪些有用的屬性?

3、注意點


1、html有哪些標籤?

<html>        之間的文本描述網頁
<body>        之間的文本是可見的頁面內容
<h1>        之間的文本被顯示爲標題
<p>        之間的文本被顯示爲段落
<a>    href、target    HTML 鏈接是通過 <a> 標籤進行定義的。
<img>        HTML 圖像是通過 <img> 標籤進行定義的。
<table>    border    定義 HTML 表格
<hr>        標籤在 HTML 頁面中創建水平線。
<!-->        可以將註釋插入 HTML 代碼中,這樣可以提高其可讀性,使代碼更易被人理解。瀏覽器會忽略註釋,也不會顯示它們。
<br>       
<form>    text、radio、submit    HTML 表單用於收集用戶輸入。表單元素指的是不同類型的 input 元素、複選框、單選按鈕、提交按鈕等等。
<select>        <select> 元素定義下拉列表:
<option>        元素定義待選擇的選項。
<textarea>    name、rows、clos    
<datalist>        設置預定義值的 <input> 元素
<input>    button、radio、number    

        這是我作爲第一次接觸HTML接觸到的,我在這時一直想的一個問題是:如此醜陋的界面,如何通過標籤裏的屬性讓界面變漂亮?

        答案:通過css來進行界面的調控,不要想着通過html標籤裏的屬性進行調控。


2、css裏有的哪些有用的屬性?

     個人認爲的屬性排行:

            添加背景、背景顏色:background-color、background-image

      .background1{  background-color:gray;   background-image:url(back.jpg) ;  }

            居中、寬度:margin-left、margin-right、width

      .center{  margin-left:auto;    margin-right:auto;   width:40%;    }

            總:

背景    background-color        背景色(可以爲所有元素設置背景色,這包括 body 一直到 em 和 a 等行內元素。)
    padding        內邊距
    background-image        設置一個背景圖像
    background-prpeat        頁面上對背景圖像進行平鋪
    background-position        改變圖像在背景中的位置。
            
文本    text-indent        可以方便地實現文本縮進
    text-align        值 left、right 和 center 會導致元素中的文本分別左對齊、右對齊和居中。
    word-spacing        改變字(單詞)之間的標準間隔
    latter-spacing        字母間隔修改的是字符或字母之間的間隔
    text-transfrom        處理文本的大小寫
    text-decoration        提供了很多非常有趣的行爲
    white-space        會影響到用戶代理對源文檔中的空格、換行和 tab 字符的處理
            
字體    font-family        定義文本的字體系列
    font-style        用於規定斜體文本。
    font-variant        可以設定小型大寫字母
    font-weight        設置文本的粗細(數字 400 等價於 normal,而 700 等價於 bold。)
    font-size        設置文本的大小(1em 等於當前的字體尺寸。如果一個元素的 font-size 爲 16 像素,那麼對於該元素,1em 就等於 16 像素。在設置字體大小時,em 的值會相對於父元素的字體大小改變。)
            
鏈接    a:link(visited\hover\active)        
    text-decoration        屬性大多用於去掉鏈接中的下劃線
            
列表    list-style-type        用於列表項的標誌類型
    list-style-image        你可能想對各標誌使用一個圖像
    list-style        可以將以上 3 個列表樣式屬性合併爲一個方便的屬性
            
表格    border        設置表格邊框
    width        表格的寬度
    height        表格的高度
    text-align        性設置水平對齊方式
    vertical-align        設置垂直對齊方式
    padding        控制表格中內容與邊框的距離
    backgournd-color        背景顏色
    color        文本顏色
            
內邊距    padding-top(right\bottom\left)       

         3、注意點

       1、首先對於css文件在html裏的引用需要在head標籤里加入link子標籤

<link rel="stylesheet" type="text/css" href="style.css">

            href引號裏括起來的就是你自己編寫的css文件。


發佈了88 篇原創文章 · 獲贊 22 · 訪問量 11萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章