ਤੁਹਾਡੇ ਬਲਾੱਗ 'ਤੇ ਕੋਡ ਲਈ CSS ਸਟਾਈਲ

CSS

ਮੇਰੇ ਇੱਕ ਦੋਸਤ ਨੇ ਮੈਨੂੰ ਪੁੱਛਿਆ ਕਿ ਮੈਂ ਆਪਣੀ ਆਖਰੀ ਬਲਾਗ ਐਂਟਰੀ ਤੇ ਕੋਡ ਖੇਤਰ ਕਿਵੇਂ ਬਣਾਇਆ. ਮੈਂ ਅਸਲ ਵਿੱਚ ਇੱਕ ਸ਼ੈਲੀ ਦੀ ਵਰਤੋਂ ਕਰਦਿਆਂ ਕੋਡ ਖੇਤਰ ਨੂੰ 'ਨਕਲੀ' ਕੀਤਾ ਹੈ. ਬਲੌਗਰ ਦੇ ਅੰਦਰ, ਤੁਸੀਂ ਆਪਣੇ ਟੈਂਪਲੇਟ ਨੂੰ ਸੋਧ ਸਕਦੇ ਹੋ. ਮੈਂ ਹੇਠਲੀ ਸ਼ੈਲੀ ਸ਼ਾਮਲ ਕੀਤੀ:

ਪੀ ਕੋਡ {ਫੋਂਟ-ਪਰਿਵਾਰ: ਕੋਰੀਅਰ ਨਿ New; ਫੋਂਟ-ਅਕਾਰ: 8pt; ਬਾਰਡਰ-ਸ਼ੈਲੀ: ਇਨਸੈੱਟ; ਬਾਰਡਰ-ਚੌੜਾਈ: 3px; ਪੈਡਿੰਗ: 5 ਪੀਐਕਸ; ਪਿਛੋਕੜ ਦਾ ਰੰਗ: #FFFFFF; ਲਾਈਨ ਉਚਾਈ: 100%; ਹਾਸ਼ੀਏ: 10px}

ਅਗਲਾ ਕਦਮ ਮੇਰੇ ਟੈਗ ਨੂੰ 'ਐਡਿਟ ਐਚਟੀਐਮਐਲ' ਮੋਡ ਵਿੱਚ ਸੰਪਾਦਿਤ ਕਰਨਾ ਹੈ. ਮੈਂ ਬਸ ਟੈਗ ਬਣਾ ਕੇ ਆਪਣੀ ਨਵੀਂ ਸ਼ੈਲੀ ਵੱਲ ਇਸ਼ਾਰਾ ਕਰਦਾ ਹਾਂ. ਵੋਇਲਾ! ਸ਼ੈਲੀ ਨੂੰ ਤੋੜਨਾ:

  • ਫੋਂਟ ਨੂੰ ਕੁਰੀਅਰ ਨਿ to 'ਤੇ ਸੈਟ ਕਰੋ ... ਆਮ ਕੋਡ ਸੰਪਾਦਕ ਦੀ ਤਰ੍ਹਾਂ ਜਾਪਦਾ ਹੈ
  • ਸਹੀ ਲੱਗਣ ਲਈ ਫੋਂਟ ਦਾ ਅਕਾਰ 8pt ਸੈੱਟ ਕਰੋ
  • ਪੈਰਾਗ੍ਰਾਫ ਬਾਰਡਰ ਸ਼ੈਲੀ ਨੂੰ 'ਇਨਸੈੱਟ' ਤੇ ਸੈਟ ਕਰੋ. ਇਹ ਇਸ ਨੂੰ ਦੁਹਰਾਉਂਦਾ ਹੈ ਕਿ ਟੈਕਸਟਰੀਆ ਪੰਨੇ 'ਤੇ ਕਿਸ ਤਰ੍ਹਾਂ ਦਾ ਦਿਸਦਾ ਹੈ.
  • ਬਾਰਡਰ ਦੀ ਚੌੜਾਈ ਨੂੰ 2 ਜਾਂ 3 ਪਿਕਸਲ ਸੈੱਟ ਕਰੋ. ਇਹ ਇਨਸੈੱਟ ਬਾਰਡਰ ਸਟਾਈਲ ਨੂੰ ਸਹੀ ਦਿਖਾਈ ਦਿੰਦਾ ਹੈ.
  • ਪੈਡਿੰਗ ਬਾਰਡਰ ਅਤੇ ਅੰਦਰਲੇ ਟੈਕਸਟ ਦੇ ਵਿਚਕਾਰ ਦੂਰੀ ਤਹਿ ਕਰਦੀ ਹੈ.
  • ਬੈਕਗ੍ਰਾਉਂਡ ਰੰਗ ... ਇਸਨੂੰ ਚਿੱਟਾ ਸੈੱਟ ਕਰੋ (#FFFFFF)
  • ਰੇਖਾ ਉਚਾਈ - ਮੈਂ ਇਸਨੂੰ 100% ਵਿੱਚ ਐਡਜਸਟ ਕੀਤਾ ਕਿਉਂਕਿ ਮੇਰੇ ਬਲੌਗਰ ਥੀਮ ਵਿੱਚ ਕੁਝ ਹੋਰ ਸ਼ੈਲੀਆਂ ਨੇ ਮੇਰੀ ਲਾਈਨ ਦੀ ਉਚਾਈ ਲਗਭਗ 200% ਬਣਾ ਦਿੱਤੀ.
  • ਹਾਸ਼ੀਏ ਨੂੰ 10 px ਸੈੱਟ ਕਰੋ. ਇਹ ਪੈਰਾਗ੍ਰਾਫ (ਪੀ ਟੈਗ) ਹਰ ਚੀਜ਼ ਤੋਂ 10 ਪਿਕਸਲ ਦੂਰ ਭੇਜਦਾ ਹੈ.

ਬੱਸ ਇੰਨਾ ਹੀ ਹੈ! ਇਕ ਨੋਟ: ਬਲੌਗਰ ਦੇ ਨਾਲ ਆਉਣ ਵਾਲਾ ਸੰਪਾਦਕ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨ ਦੇ ਯੋਗ ਨਹੀਂ ਹੈ ਜਿਵੇਂ ਕਿ ਇਹ ਤੁਹਾਡੇ ਬਲੌਗ ਵਿਚ ਦਿਖਾਈ ਦੇਵੇਗਾ. ਪਰ ਇਹ ਕੰਮ ਕਰਦਾ ਹੈ ਅਤੇ ਬਹੁਤ ਵਧੀਆ ਲੱਗਦਾ ਹੈ!

ਇਕ ਹੋਰ ਨੋਟ ... ਟੈਗ ਵਿਚ ਸੰਪਾਦਨ ਕਰਨ ਤੋਂ ਬਾਅਦ, ਬਲੌਗਰ ਸੰਪਾਦਕ ਇਸ ਨੂੰ ਆਪਣੀ ਪੋਸਟ ਦੇ ਹੋਰ ਕਿਤੇ ਇਸਤੇਮਾਲ ਕਰਨਾ ਪਸੰਦ ਕਰਦਾ ਹੈ. ਇਹ ਥੋੜਾ ਜਿਹਾ ਤੰਗ ਕਰਨ ਵਾਲਾ ਹੈ! ਮੇਰੀ ਸਲਾਹ ਇਹ ਹੋਵੇਗੀ ਕਿ ਤੁਹਾਡੀ ਪੂਰੀ ਪੋਸਟ ਲਿਖੋ ਅਤੇ ਫਿਰ ਬਾਅਦ ਵਿਚ ਇਕ ਛੋਟਾ ਸੰਪਾਦਨ ਕਰੋ.

ਇੱਕ ਅੰਤਮ ਨੋਟ ... ਆਪਣੇ ਨਿਸ਼ਾਨ ਪ੍ਰਦਰਸ਼ਤ ਕਰਨ ਲਈ HTML ਐਂਟਰੀਆਂ ਦੀ ਵਰਤੋਂ ਕਰਨਾ ਨਿਸ਼ਚਤ ਕਰੋ! ਇਸ ਦੀਆਂ ਕੁਝ ਉਦਾਹਰਣਾਂ:

  • ਹਵਾਲੇ (“) ਹਨ“
  • > ਹੈ>
  • > ਹੈ>

ਹੈਡਿੰਗ ਕੋਡਿੰਗ!

3 Comments

  1. 1

    ਮੈਨੂੰ ਇਹ ਜਾਣਨਾ ਬਹੁਤ ਉਤਸੁਕ ਹੈ ਕਿ ਮੈਂ ਇੱਕ ਨਿ newsਜ਼ ਸਾਈਟ ਤੋਂ ਕਿੱਥੇ ਫੀਡ ਸ਼ਾਮਲ ਕਰ ਸਕਦਾ ਹਾਂ ਤਾਂ ਜੋ ਖ਼ਬਰਾਂ ਮੇਰੇ ਸਾਈਡ ਬਾਰ ਤੇ ਆ ਜਾਣ?

  2. 2
  3. 3

    ਮੈਨੂੰ ਗੱਲ ਇਹ ਹੈ ਕਿ ਹੁਣ ਲਿਖਣ ਦੀ ਕੋਈ ਜ਼ਰੂਰਤ ਨਹੀਂ ਹੈ. ਤੁਸੀਂ ਮਦਦਗਾਰ ਸੰਪਾਦਕਾਂ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ. ਤੁਸੀਂ ਰੰਗ, ਬਾਰਡਰ ਆਦਿ ਦੀ ਚੋਣ ਕਰ ਸਕਦੇ ਹੋ.

ਤੁਹਾਨੂੰ ਕੀ ਲੱਗਦਾ ਹੈ?

ਇਹ ਸਾਈਟ ਸਪੈਮ ਨੂੰ ਘੱਟ ਕਰਨ ਲਈ ਅਕਕੀਮੈਟ ਵਰਤਦੀ ਹੈ. ਜਾਣੋ ਕਿ ਤੁਹਾਡੇ ਟਿੱਪਣੀ ਡੇਟਾ ਦੀ ਪ੍ਰਕਿਰਿਆ ਕਿਵੇਂ ਕੀਤੀ ਜਾਂਦੀ ਹੈ.