Hãy đăng ký thành viên để có thể dễ dàng trao đổi, giao lưu và chia sẻ về kiến thức đồ họa.
  1. Hãy đăng ký subscribe kênh Youtube mới của Việt Designer tại địa chỉ: Youtube.com/VietDesignerChannel để theo dõi các video về thiết kế đồ họa. Do trước đó kênh cũ bị Youtube quét không rõ lý do, trong thời gian chờ kháng cáo nếu các bạn thấy video trên diễn đàn bị die không xem được thì có thể vào kênh mới để tìm xem video sơ cua nhé.
    Loại bỏ thông báo

Xin hướng dẫn về CSS

Chủ đề thuộc danh mục 'Hỏi đáp - Thảo luận về web' được đăng bởi Đoilơ ViệtDesigner, 11/6/13.

Lượt xem: 2,352

  1. Đoilơ ViệtDesigner Thành viên cấp 5

    Tình hình là em muốn làm mất cái icon cũ của fb để chèn vào icon mới,. nhưng khi em dùng code này
    Code:
    #fbRequestsJewel.uiToggle {
        background-image:url("http://upanh.4themevn.com/ww.png") !important;
        background-repeat:no-repeat !important;
        background-size:auto !important;
      }
     
    #fbRequestsJewel.uiToggle :focus, #fbRequestsJewel.uiToggle :hover {
        background-image:url("http://upanh.4themevn.com/ww.png") !important;
        background-repeat:no-repeat !important;
        background-size:auto !important;
          }
    thì cái icon cũ của fb nó ko mất,. cái em muốn thay vào thì nó lại chồng lên nhau tạp nham tùm lum,. nên em muốn xin cách fix ợ.

    [​IMG]

    ...
  2. SITUVN

    SITUVN Thành viên cấp 2

    Nhầm thẻ, cái thẻ đó là thẻ ngoài, thế nên cái hình mới bị hình cũ che đi.
    Code:
    #fbRequestsJewel a.jewelButton, #fbRequestsJewel a.jewelButton:hover, #fbRequestsJewel a.jewelButton:focus {
        background-image:url("http://upanh.4themevn.com/ww.png") !important;
        background-repeat:no-repeat !important;
        background-size:auto !important;
    }
    
  3. Đoilơ ViệtDesigner

    Đoilơ ViệtDesigner Thành viên cấp 5

    @SITTUVN Em lấy code của bác thay vào nó lại ko hiện gì luôn,. hiện mỗi icon cũ của fb.
  4. Nguyễn Hoàng Minh Long

    Nguyễn Hoàng Minh Long Thành viên cấp 3

    máy cái code này sửa chỉ để tự sướng thôi hả mấy bác ?
  5. Gooner Designer

    Gooner Designer Thành viên cấp 4

    Nguyễn Hoàng Minh Long. :3 người ta đang làm web đó.
  6. SITUVN

    SITUVN Thành viên cấp 2

    Đoilơ ViệtDesigner: do chưa thêm thuộc tính:
    Code:
    #fbRequestsJewel a.jewelButton, #fbRequestsJewel a.jewelButton:hover, #fbRequestsJewel a.jewelButton:focus {
        background-image:url("http://upanh.4themevn.com/ww.png") !important;
        background-repeat:no-repeat !important;
        background-size:auto !important;
        background-position: 0px !important; // Đây này
    }
    
    Facebook dùng Image Sprite nên nó định thên thuộc tính này để lấy vị triis cái hình cần lấy trong cái hình ton đùng: http://static.ak.fbcdn.net/rsrc.php/v2/yw/r/dx7GXomUrjl.png
    Mặc định nó là :
    Code:
    background-position: 0px 200px
    
    Lưu ý là phải sửa nữa, vì khi nhấn chuột vào nó lại hiện hình cũ lên.

    ----
    Cập nhật đầy đủ cho chế độ: bình thường, rê chuột, tiêu điểm (focus) và nhấn chuột.
    Code:
    #fbRequestsJewel a.jewelButton,
    #fbRequestsJewel a.jewelButton:hover,
    #fbRequestsJewel a.jewelButton:focus,
    .notifNegativeBase #fbRequestsJewel.openToggler a.jewelButton {
        background-image:url("http://upanh.4themevn.com/ww.png") !important;
        background-repeat:no-repeat !important;
        background-size:auto !important;
        background-position: 0px !important;
    }
    
  7. thanhmai3883

    thanhmai3883 Thành viên cấp 3

    Show web ra.
  8. Đoilơ ViệtDesigner

    Đoilơ ViệtDesigner Thành viên cấp 5

    Gì mà web wuệc vậy chài,. em đang luyện thằng CSS nên là lấy fb làm vật thí nghiệm mà trời,. tại mọi hôm dùng code trên được,. mà giờ lại ko được nên vô đây hỏi,. học thêm html nữa thì có thể làm web đc rồi :D

    SITUVN vẫn ko đc ợ =o=
  9. SITUVN

    SITUVN Thành viên cấp 2

    Chẳng lẽ bạn dùng giao diện mới :|
    Mình chỉnh ra vầy đây:
    [​IMG]
  10. Đoilơ ViệtDesigner

    Đoilơ ViệtDesigner Thành viên cấp 5

    Em cũng chả biết nó là mới hay cũ,. chắc nửa mùa quá,. thấy mấy người khác cái chỗ chat nó ở bên trái,. còn em vẫn ở bên phải,. nhưng thanh sidebar lại giống nhau :| còn giao diện em đang dùng thì đây.

    em dùng firebug để xem cả 2 giao diện cũ và mới thì vẫn code này
    #fbRequestsJewel a.jewelButton

    [​IMG]
  11. Đoilơ ViệtDesigner

    Đoilơ ViệtDesigner Thành viên cấp 5

    Lại vẫn chắc mắc y chang cái cũ, nhưng lần này là về cái logo
    code của cái logo fb là #pagelogo

    [​IMG]

    Em dùng code
    Code:
    #pagelogo
    {
    background: url("http://upanh.4themevn.com/Lw.png") !important;
    }
    Nhưng nó cũng vẫn cứ bị chồng hình mới lên hình cũ,.. thử thêm cái z-index vẫn thế @@
  12. SITUVN

    SITUVN Thành viên cấp 2

    Xem thử bên trong còn thẻ nào nữa không, bị che y như mấy cái kia.

    Chẳng hiểu cái Facebook bị quái gì nữa, vào không được.
  13. pingpoong

    pingpoong Thành viên cấp 2

    Đoilơ ViệtDesigner: Xem thử có thẻ nào chưa xóa không ? Được thì bạn đưa đoạn source đó lên để mình xem
  14. Đoilơ ViệtDesigner

    Đoilơ ViệtDesigner Thành viên cấp 5

    Tất tần tật ở đây,. #pagelogo ở dưới cùng chỗ code này.

    Code:
    .===============© Doila.fuka================{}
    .======================================={}
    .======================================={}
    .======================================={}
    .======================================={}
    .======================================={}
    .===============VietDesigner™==============={}
     
    .FONT CHỮ{}
    *{
    font-family: "segoe ui" !important;
    font-size: auto !important;
    cursor:
    }
     
    .uiStreamMessage, .uiStreamHeadline, .uiStreamPassive, .actorDescription, .uiStreamRobotextBeforeMessage, .messageBody{
    font-size: 17px !important;
    }
     
    .userContent {
    font-size: 17px !important;
    color: dark !important;
    }
     
    .linkWrap, .uiButtonText, .uiHeaderTitle, .friendBrowserNameTitle, .ci_module_header{
    color: #808080 !important;
    }
     
    .actorDescription
    {
    color: #aeaeae !important;
    }
     
    .=========================================================={}
     
    .THANH SIDEBAR{}
     
    .slim #blueBar {
    height: 51px !important;
    position: relative;
    background-color: #1d2126 !important;
    background-image: url("http://upanh.4themevn.com/jv.png") !important;
    box-shadow: 0px 0px 27px #2b2f3a !important;
    border: 0px 10px 10px 2px solid #ffffff !important;
    }
     
    .=========================================================={}
     
    .SỐ THÔNG BÁO{}
     
    #notificationsCountValue{
    margin-top: 1px;
    border-radius: 2px !important;
    background: url("http://upanh.4themevn.com/Nv.png") !important;
    -webkit-box-shadow:3px 0px 3px rgba(0, 0, 0, 0.3) !important;
    box-shadow:0px 1px 6px 0px rgba(0, 0, 0, 0.3) !important;
      color: red !important;
    }
     
    .=========================================================={}
     
    .uiSelectorMenuWrapper, .uiMenuXBorder {
    background: rgba(255, 255, 255, 0.98);
    background: rgba(255, 255, 255, 0.98);
    border: 0px solid #C5C5C5;
    margin-top: 1px;
    }
     
    .=========================================================={}
     
    .TRANG CHÍNH{}
     
    .homeWiderContent div#contentArea {
    margin-right: -10px !important;
    background: url("http://upanh.4themevn.com/zv.png");
    padding-right: auto !important;
    opacity: 10;
    border-right: 0px;
    border-left: 0px solid #CCC !important;
    min-width: 755px;
    }
     
    .=========================================================={}
     
    .XÓA QUẢNG CÁO{}
     
    #rightCol{
    display: none !important;
    }
     
    .=========================================================={}
     
    #contentCol.homeWiderContent {
    margin-top: -8px !important;
    }
     
    #mainContainer{
    margin-top: 11px !important;
    }
     
    .=========================================================={}
     
    .BO GÓC + STROKE ẢNH{}
    .uiPhotoThumb{
        box-shadow: 0px 0px 3px #3d5997 !important;
        border: 3px solid #ffffff !important;
        margin-left: auto !important;
        border-radius:1px !important;
          margin-top: auto !important;
    }
     
    .=========================================================={}
     
    .KHUNG COMMENT + STT {}
     
    .shareRedesign, .pam, ._42efm, #shareRedesignContainer, ._1dsp, .facemoji_emoji_popup, .UFICommentContent, .UFIReplyList, .UFIRow,  .UFIAddComment, .UFIAddCommentWithoutSeparator, .UFILastComponent, .uiScrollableAreaContent, .uiStreamEdgeStoryLineTx, #u_p_0, ._54ng, #fbTimelineUFI, .UFICommentActions, .UFIComment, .uiCommentContainer, .UFIImageBlockContent, ._8u, .UFIList,  .uiMenuInner, #u_0_1._8-b, .shareRedesignContainer, #MercuryJewelThreadList.uiScrollableArea, ._4wr, .UFIBlingBox, .uiBlingBox, #itemLabel, .uiSelectorMenuWrapper, .itemAnchor, #userNavigation, .navigation, #accountSettingsFlyout, .jewelFlyout, .uiButtonSuppressed, .uiButton, .uiScrollableArea, .InterestListMenuDisconnect, .uiMenu, ._57-m
      {
      background: url("http://upanh.4themevn.com/zv.png") !important;
      }
     
    ._2yg, .innerWrap, ._nli, .rhcHeader, .photoUfiContainer, ._42ft, ._42fu, ._8-b, ._9oy, .uiSelectorMenuWrapper, .selected, #navSubmenu, #userNavigation.navigation, .back, #inputtext, .titlebarLabel, .fbNubFlyoutTitlebar, a.fbNubButton, ._54ng,  ._569t, ._2o49, ._6ji, ._585-
    {
    background: url("http://upanh.4themevn.com/Pv.png") !important;
    }
     
    ._kj3, .pbs
    {
    background: url("http://upanh.4themevn.com/zv.png");
    }
     
    .BỔ SUNG{}
    ._1qp5, #u_0_1
    {}
     
     
    ._42ft, ._42fu, .uiToggle, .uiSelectorButton{
    border-color: #b0b0b0 !important;
    border: 0px #b0b0b0 !important;
    color: #888888 !important;
        }
     
    .CMT{}
    #u_13_n, #u_1w_r {
      background: url("http://upanh.4themevn.com/Tv.png");
    }
     
     
    .===LOGO VIETDESIGNER==={}
    ._2wr{
    background: url("http://upanh.4themevn.com/Kw.png") !important;
      width: 48px !important;
      height: 31px !important;
      margin-top: -27px !important;
      margin-left:  263px !important;
      opacity: 70;
      position: auto !important;
      }
     
    .=========================================================={}
     
    .XÓA ĐƯỜNG VIỀN {}
     
    ._2yg, .UFIBlingBox, .uiBlingBox, .UFICommentContent, .UFIRow, .UFIComment, .UFIFirstComponent, .uiTypeahead, #userNavigation, .navigation, .wrap, #accountSettingsFlyout, .jewelFlyout, .uiButton, .actions, .uiLinkButton, ._54ng, #u_0_1h, ._53ij, .uiMenu, .uiSelectorMenu, ._54hx
    {
    border: 0px !important;
    }
     
    #u_0_1h, .uiMenu, .uiSelectorMenu, ._54ng
    {
    -webkit-box-shadow:2px 0px 2px rgba(0, 0, 0, 0.3) !important;
    box-shadow:0px 2px 4px 0px rgba(0, 0, 0, 0.3) !important;
    }
     
    ._5861{
    border-radius: 0px;
    }
     
    .=========================================================={}
     
    body, .mvl, #pageFooter, #contentCurve, #content, .fbChatOfflineMessage, .loggedout_menubar_container, .login_error_box, .uiBoxRed, .stageContainer{
    background: url("http://upanh.4themevn.com/Bv.png") !important;
    }
    .vMid
    {
    }
     
     
     
    .titlebarLabel, .fbNubFlyoutTitlebar
    {
    height: 25px !important;
    }
     
    #pagelet_welcome_box, .onlyMeBorder, .uiBoxYellow, .bottomborder, #contentCurve, .ego_unit_container
    {
      display: none !important;
    }
     
     
    #pagelet_navigation, .uiSideNav, .item, .uiSideNav, .subitem, .storyInnerContent, .uiMenuInner, #itemLabel, .uiSelectorMenuWrapper, .itemAnchor, ._54nh, .uiContextualLayer, .titlebarLabel, .fbNubFlyoutTitlebar, .fbNubButton, .login_form_container, .uiHeader, .mvl, .login_error_box, .uiBoxRed{
      border: 0px !important;
    }
     
    .fbNubButton
    {
    margin-top: 2px !important;
    }
     
    #titlebarText, ._51sn, #titlebarTextWrapper, #u_0_2x.titlebarText, #fwb
    {
    margin: 2px !important;
    }
     
    h3.uiHeaderTitle{
    color: #a1a1a1 !important;
    }
     
    #fbTimelinePagesFilterSelectorButton
    {
        border-radius: 1px !important;
        background: url("http://upanh.4themevn.com/Bv.png") !important;
        -webkit-box-shadow:3px 0px 3px rgba(0, 0, 0, 0.3) !important;
        box-shadow:0px 1px 6px 0px rgba(0, 0, 0, 0.3) !important;
    }
    .=========================================================={}
     
    #leftCol #pagelet_navigation li:not(.selectedItem) .img {
    filter: grayscale(100%) !important;
    -webkit-filter: grayscale(100%) !important;
    -moz-filter: grayscale(100%) !important;
    -ms-filter: grayscale(100%) !important;
    -o-filter: grayscale(100%) !important;
    filter: gray !important;
    -webkit-filter: grayscale(1) !important;
    }
     
    #leftCol #pagelet_navigation li:not(.selectedItem):hover .img {
        filter: none !important;
    -webkit-filter: none !important;
    -moz-filter: none !important;
    -ms-filter: none !important;
    -o-filter: none !important;
    }
     
    .uiSideNav .selectedItem .item,.uiSideNav .selectedItem .item:hover,.uiSideNav ul .selectedItem .subitem,.uiSideNav ul .selectedItem .subitem:hover {
        background: url("http://upanh.4themevn.com/Bv.png") !important;
        -webkit-box-shadow:0px 0px 5px rgba(0, 0, 0, 0.3) !important;
        box-shadow:1px 0px 10px rgba(0, 0, 0, 0.3) !important;
        border-radius:1px 0px 0px 1px;
        padding-top:6px !important;
        padding-bottom: 4px !important;
        width:142px !important;
        margin-right:-22px;
        margin-top:10px !important;
        margin-bottom:10px !important;
        font-size: 15px !important;
     
    }
     
    #leftCol #pagelet_navigation li {
        width: 142px !important;
        -webkit-transition:margin-left 0.3s;
        -moz-transition:margin-left 0.3s;
        -o-transition:margin-left 0.3s;
        -ms-transition:margin-left 0.3s;
        transition:margin-left 0.3s;
    }
     
     
    #leftCol #pagelet_navigation li:not(.selectedItem):Hover {
        margin-left:0px !important;
        -webkit-transition:all 0.3s;
        -moz-transition:all 0.3s;
        -o-transition:all 0.3s;
        -ms-transition:all 0.3s;
        transition:all 0.3s;
    }
     
    #leftCol #pagelet_navigation li:not(.selectedItem):hover {
        background: url("http://upanh.4themevn.com/Bv.png") !important;
        width: 130px !important;
        -webkit-box-shadow:3px 0px 3px rgba(0, 0, 0, 0.3) !important;
        box-shadow:2px 0px 6px rgba(0, 0, 0, 0.3) !important;
        border-radius:1px 0 0 1px !important;
        text-shadow:1px 0px 1px rgba(255, 255, 255, .6);
        margin-left:25px !important;
        padding-right:23px !important;
    }
     
    #leftCol #pagelet_navigation li:not(.selectedItem) {
        margin-left:13px !important;
    }
     
    .uiSideNav .open {
        position:relative;
        z-index:5;
    }
     
    div#contentArea {
        position:relative;
    }
     
    #pagelet_navigation .uiSideNav .buttonWrap {
        float:right !important;
        margin-right:-22px !important;
    }
     
    #pagelet_navigation .uiSideNav li:not(.selectedItem) .item {
        margin-left:10px !important;
          margin: 9px !important;
    }
     
    #pagelet_navigation .uiSideNav .item:hover {
        background-color:transparent !important;
    }
     
    #leftCol .uiFacepileMedium li {
        margin-left:0px;
        -webkit-transition:none;
        -moz-transition:none;
        -o-transition:none;
        -ms-transition:none;
        transition:none;
    }
     
    #leftCol .uiFacepileMedium li:not(.selectedItem):Hover {
        margin-left:0px !important;
        border-radius:px !important;
        -webkit-transition:none;
        -moz-transition:none;
        -o-transition:none;
        -ms-transition:none;
        transition:none;
    }
     
    .count
    {
    left: 20px !important;
    background: none !important;
    position: block !important;
    border-radius: 2px !important;
    color: #a1a1a1 !important;
    }
     
     
     
    ._s0
    {
    -webkit-box-shadow:4px 0px 4px rgba(0, 0, 0, 0.3) !important;
    box-shadow:0px 1px 6px 0px rgba(0, 0, 0, 0.3) !important;
    border-radius: 2px !important;
    }
     
    #navFindFriends, .uiCloseButton
    {
    display: none !important;
    }
     
    #u_ps_0_0_1
      {
    background: none !important;
    margin-top: -12px !important;
    right: 7px !important;
      }
     
    .=========================================================={}
     
      .PHOTO TIMELINE{}
     
    .profilePic,.profilePicThumb{
    border-radius:100px !important;
    -webkit-box-shadow:0 2px 10px 0 rgba(0, 0, 0, 0.3);
    box-shadow:0 2px 10px 0 rgba(0, 0, 0, 0.3);
    -webkit-transition:all 0.9s;
    -moz-transition:all 0.9s;
    -o-transition:all 0.9s;
    -ms-transition:all 0.9s;
    transition:all 0.9s;
    }
     
     
    .profilePicThumb:hover{
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    }
     
    .=========================================================={}
     
    .WALL POST{}
     
    .spinePointer
    {
    display: none !important;
    }
     
    .fbTimelineUnit,#fbProfileCover
    {
     
    -webkit-transition:all 0.4s;
    -moz-transition:all 0.4s;
    -o-transition:all 0.4s;
    -ms-transition:all 0.4s;
    transition:all 0.4s;
    }
     
    .fbTimelineUnit:hover {
        -webkit-transform:scale(1.05);
        -moz-transform:scale(1.05);
        -o-transform:scale(1.05);
        -ms-transform:scale(1.05);
        transform:scale(1.05);
        z-index:100;
    }
     
     
    .shareRedesign
    {
    width: 650px;
      }
     
    .overlayTitle
    {
    background: url("http://upanh.4themevn.com/Pv.png") !important;
      }
     
    #userNavigation.navigation
    {
    background: url("http://upanh.4themevn.com/Pv.png") !important;
    }
     
    ._53io
    {
    display: none !important;
    }
     
    #pageLogo
    {
    background: url("http://upanh.4themevn.com/Lw.png") !important;
    width: 29px;
    height: 29px;
    }
     
    
    Có gì mọi người cứ cmt ở dưới trợ giúp cho em,. chiều em ngủ dậy em vào xem ợ,. giờ buồn ngủ lắm lắm rồii .___.
  15. pingpoong

    pingpoong Thành viên cấp 2

    Có HTML không ?????????
  16. Đoilơ ViệtDesigner

    Đoilơ ViệtDesigner Thành viên cấp 5

    Em chỉ biết và viết mỗi CSS thôi ợ.
    Nếu dùng chrome thì chị có thể vào kho store tìm cái app Stylish cài vào chrome rồi click vào logo Stylish -> chọn manage installed style rồi -> chọn write new style sau đó copy toàn bộ đoạn code của em ném vào rồi enable sau đó f5 facebook ( nếu đang bật ) là nó sẽ áp dụng vào fb ngay.

    Em xin phép đi ngủ chiều dậy em vào sau ợ,. em thanks trước mọi người nhiều nhiều nhiều :x

Ủng hộ diễn đàn