當前位置: 首頁  - 標簽“CSS“ - 列表 學而時習之,不亦說乎

CSS

前端設計去掉input(number類型)輸入框箭頭的方法教程

去掉input(number類型)輸入框箭頭的方法教程

国产视频app 在web前端中,number類型的input輸入框在獲得鼠標焦點的情況下,會出現兩個向上和向下的箭頭。雖然箭頭可用于input輸入框中的數字增大和減小,但在某些特定的場景中反而會讓用戶產生錯亂的感覺。為了避免此情況的發生,我們可以使用css樣式來隱藏掉 input 中的箭頭,下面來說說方法!number類型input輸入框去掉箭頭的教程1

前端設計禁止 input 自動彈出下拉框的方法

禁止 input 自動彈出下拉框的方法

国产视频app 經常設計 form 表單的開發應該知道,用戶在瀏覽器中向表單輸入信息的時候會被 input 記錄下來,以后每次雙擊 input 文本框時都會展示以前輸入過的信息,雖然這樣很方便,但會暴露用戶的隱私數據。那如何禁止 input 輸入框不記錄用戶輸入的信息呢?下面就來說一下!input 中的 autocomplete 屬性autocomple

前端設計js實現鼠標拖動div改變其位置的教程

js實現鼠標拖動div改變其位置的教程

国产视频app 今天接到一個小小的需求,就是利用 JS 來實現鼠標拖動一個div,來實現其位置的改變。雖然說要求看著很簡單,但實現起來還是比較難一點的,下面就說說實現的方法!js實現鼠標拖動div改變其位置的方法先上個圖示,大家看一下效果!js實現鼠標拖動的div的代碼html完整代碼<!DOCTYPE html><html>&l

前端設計DIV+CSS制作(table)表格的方法

DIV+CSS制作(table)表格的方法

在前端的網頁設計需求中,有時候需要使用表格來展示一些數據,但又不能使用 html 中的 table 標簽來做,那么我們只有使用 DIV + CSS 來畫一個表格了。下面就介紹幾種方法,大家來參考一下!使用 DIV+CSS 制作一個表格先上一個由CSS+DIV簡單制作的表格樣式的示例!html示例代碼:<!DOCTYPE html&g

前端設計css 選擇沒有內容的元素的方法

css 選擇沒有內容的元素的方法

今天在寫一個主題時,需要把一些沒有內容的元素給隱藏掉,由于是由后臺動態生成的頁面,不知道沒有內容的元素在哪。當然這種問題對于技太大姥來說,是簡單的一筆,但對于像我這種菜鳥來說,就很難了。所以就想出了,用CSS來隱藏一些空內容元素的方法。CSS :empty 選擇器介紹css 選擇內容為空的元素,需要用到 CSS 的 :empty 選擇器!

前端設計css calc() 進行計算的方法

css calc() 進行計算的方法

css3 中給我們提供了一個很有意思的函數 calc(),此函數可以讓瀏覽器在解析CSS時,對元素的長度,寬度,以及其它的屬性進行加,減,乘,除的計算。它的應用不是很廣泛,但一般在自適應類型的網頁中會經常看到它的身影。css calc() 計算函數calc():函數用于動態計算。語法:calc(expression)參數:expressi

前端設計table 表格邊框合并為單一的邊框的方法

table 表格邊框合并為單一的邊框的方法

国产视频app 在 html table 表格元素的默認設置中,如果為每個表格定義它的邊框,整體看起來就感覺非常的凌亂,所以這篇博文就說一說,如果將 table 表格的單元格邊框合成一條單線。table 表格邊框默認的樣式例代碼:<!DOCTYPE html><html><head><meta charset=&

前端設計CSS3 選擇倒數第幾個元素的方法

CSS3 選擇倒數第幾個元素的方法

国产视频app 上午在寫一段HTML時CSS樣式時,需要對一個父元素下的最后兩個子元素的樣式進行額外的定義,由于以前沒有遇到過類似的需求,就仔細得查了下網上相似的案例,發現可以使用 CSS3 中的 “:nth-last-child() ”選擇器來實現此效果。CSS3 :nth-last-child() 選擇器:nth-last-child(n):匹配其父

前端設計CSS3自定義滾動條樣式

CSS3自定義滾動條樣式

国产视频app 一些愛折騰的個人網站的站長會嫌棄瀏覽器原始的滾動條不好看,會想方設法的將瀏覽器的滾動條進行個性化的自定義,而 CSS3 就提供了 -webkit-scrollbar 屬性來自定義瀏覽器滾動條的樣式。CSS3 的 -webkit-scrollbar 屬性只支持 webkit 內核瀏覽器的滾動條設置,它可以對擁有 overflow 隱藏屬性的

前端設計CSS3 給html元素加入陰影效果的方法

CSS3 給html元素加入陰影效果的方法

在前端 html 頁面的設計中,有個別需要向訪客突出顯示的元素時,可以加上一些陰影的效果,讓它的辨識度更高,讓訪客可以一眼發現它存在。關于 html 元素的陰影效果的設置,可以使用 CSS3 中的屬性 box-shadow ,下面飛鳥慕魚博客就來和大家說一說,關于此屬性的用法。CSS3 box-shadow 屬性詳解box-shadow:

前端設計CSS3 實現div元素向上移動的效果

CSS3 實現div元素向上移動的效果

今天應一個用戶的要求,要做一個html頁面,而頁面中的部份div元素,在鼠標移入時向上移動,鼠標移出時恢復到原來的位置。效果是用純css3代碼來實現的,不使用任合的JS代碼。css3 實現div向上移動的效果代碼html代碼:<!DOCTYPE html><html><head><meta cha

前端設計CSS3實現背景顏色漸變的方法

CSS3實現背景顏色漸變的方法

上午制作網頁時,寫了一個利用 CSS3 實現網頁背景顏色漸變的效果,晚上整理代理時,發現這效果還挺好玩的。記錄下來,以后再寫這種網頁背景顏色漸變的效果時,只能復制就行了。網頁背景顏色的漸變,利用了 CSS3 中的 Gradients 屬性,而漸變的效果又分為了兩種,分別為:Linear Gradients(線性漸變) 和 Radial G

前端設計HTML+JS實現圖片下載到本地

HTML+JS實現圖片下載到本地

国产视频app 在很多網站上,都有一個點擊圖片或點擊某個鏈接會將指定的圖片下載到本地的功能,而這個功能就需要html 元素中的 A 標簽的 download 屬性來實現,接下來飛鳥慕魚博客就來說一說關于使用html或js實現圖片點擊下載的功能。A 標簽的 download 屬性download:屬性為 A 標簽在 HTML5 中新增加的一個屬性,它可以強

前端設計CSS3 中的 :nth-child() 選擇器的使用方法

CSS3 中的 :nth-child() 選擇器的使用方法

今天說一個在css3中不常用的到的選擇器屬性 :nth-child(),它可以方便的對某個HTML元素下的任何子元素進行操作,而要操作的HTML元素不分任何類型。CSS3 :nth-child() 屬性定義:nth-child(n):選擇器匹配屬于其父元素的第 N 個子元素,任何類型的元素都可以。語法::nth-child(n)參數:n

前端設計HTML input 文本框添加提示文字的方法

HTML input 文本框添加提示文字的方法

周未休息,感覺沒啥可寫的,就水一篇文章吧,說一說前端 html 頁面中 input 元素中在沒有值的情況下,添加提示的文字,當要輸入文字的時候,提示的文字消失。關于 html input 輸入框的提示文字,有兩種方法可以實現,一種為 input 元素的 placeholder 屬性,一種為 js 方法。input 元素的 placehol

前端設計html頁面中css縮放圖片的方法

html頁面中css縮放圖片的方法

在html頁面制作中,可以利用 CSS 中的 transform 屬性對圖片進行旋轉,縮放,移動或傾斜的操作。而今天我們只說說 transform 屬性對圖片進行等比例的縮放操作。css transform 屬性的介紹transform:該屬性向元素應用 2D 或 3D 轉換。它允許我們對元素進行旋轉、縮放、移動或傾斜的操作。縮放使用值:

前端設計HTML table表格邊框設置為單線的方法

HTML table表格邊框設置為單線的方法

因為平時在html頁面中設計表格樣式時,一般都是使用 DIV+CSS 的方式來實現,很少使用 table 表格元素,而今天圖省事使用 table 表格元素時,發現設置其邊框為的樣式為雙線的形式,所以就正對次問題,百度了一下解決方案。table 表格的邊框寬度不為0的樣式HTML代碼<!DOCTYPE html><html

前端設計記錄CSS中 position:fixed 踩的坑

記錄CSS中 position:fixed 踩的坑

在 html 頁面的css樣式中,如果將 position 屬性的值設置為 fixed,那就表示其元素的位置相當于顯示設備的可視區域進行定位,而今天在調試此屬性時,卻發生了一件奇怪的事件。position:fixed 定位失效情況復現失效代碼:<!DOCTYPE html><html><head><

前端設計jquery操作class屬性的方法

jquery操作class屬性的方法

使用 jquery 可以很方便的添加或刪除 html 元素的class屬性的值,以實現各種炫彩的動態效果。這篇文章就來說一說,幾種使用 jq 來操作 html 元素class屬性的方法。jq addClass() 方法jq 的 addClass() 方法,可以向一個指定的 html 元素的 class 屬性中添加一個屬性值示例:<!

前端設計js獲取和設置DIV元素class值的方法

js獲取和設置DIV元素class值的方法

web頁面中,利用js動態的改變div元素的class屬性的值,可以實現很多的動態效果。比如動態修改div元素的背景顏色,改變字體的顏色等等。這篇文章就來說一說,javascript 如何獲取和設置div元素class屬性的值的方法。js獲取元素class屬性值的方法原生js如果想要獲取div元素class屬性的值,需要用到 classN

前端設計CSS calc() 函數的介紹與使用方法

CSS calc() 函數的介紹與使用方法

在HTML頁面的DIV布局中,如果我們把DIV的寬度當做一個計算公式,讓瀏覽器去自動去計算它們的值是不是很有意思呢?那么今天就說一下,CSS中的一個關于計算的函數 calc() calc() 函數介紹calc():英文單詞calculate(計算)的縮寫,是 css3 新增加的一個功能。它可以動態的設置元素樣式中border、margin

1 2 3 末頁
點擊下拉

ZBLOG主題/插件定制開發流程

ZBLOG主題/插件定制開發流程