文字陰影-凹凸文字倾贰、過(guò)渡屬性

一冕碟、字體樣式縮寫(xiě)
font:文字粗細(xì) 大小/行高 字體名稱(chēng);
font: bold 100px/200px "微軟雅黑";
二、css3中的文字陰影
text-shadow:x y r color;
text-shadow: 1px 1px 0px #333,-1px -1px 0px #fff;
  • 01x:表示陰影在水平方向的偏移量匆浙,可以設(shè)置成負(fù)值安寺,正負(fù)不表示大小,只表示方向答憔。水平向右為正雁佳,向左為負(fù)胶逢,單位是px
  • 02y:表示陰影在垂直方向的偏移量,垂直向上為負(fù)迎捺,向下為正
  • 03r:表示陰影的模糊程度,數(shù)值越大陰影越模糊查排,單位px
  • 04color:表示陰影的顏色
  • 05 :css3允許一段文字有多層陰影凳枝,多層之間用逗號(hào)隔開(kāi),每一層內(nèi)跋核,不同參數(shù)之間用空格隔開(kāi)
凹凸文字小例子

利用文字陰影的原理岖瑰,一面陰影是暗色的,一面的陰影是亮色的砂代,顏色相換锭环,就可以出來(lái)文字凹凸效果

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>凹凸文字</title>
    </head>
    <style type="text/css">
        body{
            background: #ccc;
        }
        div{
            color: #ccc;
            text-align: center;
            font: bold 100px/200px "微軟雅黑";
            text-shadow: 1px 1px 0px #fff ,-1px -1px 0px #333;#凸形字
            #text-shadow: 1px 1px 0px #333,-1px -1px 0px #fff; #凹形字
        }
    </style>
    <body>
        <div>
            凹凸文字
        </div>
    </body>
</html>

凸形字

凹形字

三、過(guò)渡屬性

作用就是在元素的默認(rèn)樣式與最終樣式變化之間產(chǎn)生的一個(gè)過(guò)程泊藕,在css3中新增了一個(gè)屬性叫transition

transition: all 0s linear 0s;

注:

  • 01 第一個(gè)參數(shù)的作用是設(shè)置元素身上的那些屬性產(chǎn)生過(guò)度辅辩,一般用all表示所有的屬性都過(guò)渡
  • 02 第二個(gè)參數(shù)的作用設(shè)置過(guò)渡需要時(shí)長(zhǎng)难礼,單位是s,不能省略
  • 03 第三個(gè)參數(shù)的作用設(shè)置過(guò)渡的動(dòng)畫(huà)形式玫锋,linear表示勻速
  • 04 第四個(gè)參數(shù)設(shè)置當(dāng)前過(guò)渡等待多久之后才會(huì)執(zhí)行(延時(shí))蛾茉,即使為0,單位也不能省略
  • 05 :hover 選擇某個(gè)元素被鼠標(biāo)移上時(shí)的狀態(tài)
  • 06 transition 這個(gè)屬性既可以添加在元素默認(rèn)狀態(tài)撩鹿,也可以添加在鼠標(biāo)移上狀態(tài)谦炬,區(qū)別就是第二種做法在鼠標(biāo)離開(kāi)的時(shí)候不會(huì)再有過(guò)渡變化
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市节沦,隨后出現(xiàn)的幾起案子键思,更是在濱河造成了極大的恐慌,老刑警劉巖甫贯,帶你破解...
    沈念sama閱讀 221,430評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件吼鳞,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡叫搁,警方通過(guò)查閱死者的電腦和手機(jī)赔桌,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,406評(píng)論 3 398
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)渴逻,“玉大人疾党,你說(shuō)我怎么就攤上這事〔肄龋” “怎么了雪位?”我有些...
    開(kāi)封第一講書(shū)人閱讀 167,834評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀(guān)的道長(zhǎng)梨撞。 經(jīng)常有香客問(wèn)我茧泪,道長(zhǎng),這世上最難降的妖魔是什么聋袋? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 59,543評(píng)論 1 296
  • 正文 為了忘掉前任队伟,我火速辦了婚禮,結(jié)果婚禮上幽勒,老公的妹妹穿的比我還像新娘嗜侮。我一直安慰自己,他們只是感情好啥容,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,547評(píng)論 6 397
  • 文/花漫 我一把揭開(kāi)白布锈颗。 她就那樣靜靜地躺著,像睡著了一般咪惠。 火紅的嫁衣襯著肌膚如雪击吱。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 52,196評(píng)論 1 308
  • 那天遥昧,我揣著相機(jī)與錄音覆醇,去河邊找鬼朵纷。 笑死,一個(gè)胖子當(dāng)著我的面吹牛永脓,可吹牛的內(nèi)容都是我干的袍辞。 我是一名探鬼主播,決...
    沈念sama閱讀 40,776評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼常摧,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼搅吁!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起落午,我...
    開(kāi)封第一講書(shū)人閱讀 39,671評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤谎懦,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后溃斋,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體界拦,經(jīng)...
    沈念sama閱讀 46,221評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,303評(píng)論 3 340
  • 正文 我和宋清朗相戀三年盐类,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片呛谜。...
    茶點(diǎn)故事閱讀 40,444評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡在跳,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出隐岛,到底是詐尸還是另有隱情猫妙,我是刑警寧澤,帶...
    沈念sama閱讀 36,134評(píng)論 5 350
  • 正文 年R本政府宣布聚凹,位于F島的核電站割坠,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏妒牙。R本人自食惡果不足惜彼哼,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,810評(píng)論 3 333
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望湘今。 院中可真熱鬧敢朱,春花似錦、人聲如沸摩瞎。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,285評(píng)論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)旗们。三九已至蚓哩,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間上渴,已是汗流浹背岸梨。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,399評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工喜颁, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人盛嘿。 一個(gè)月前我還...
    沈念sama閱讀 48,837評(píng)論 3 376
  • 正文 我出身青樓洛巢,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親次兆。 傳聞我的和親對(duì)象是個(gè)殘疾皇子稿茉,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,455評(píng)論 2 359

推薦閱讀更多精彩內(nèi)容